github/svgedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

eslint rule for declarations

Browse Source
This commit is contained in:
JFH
2021-05-28 17:03:29 +02:00
parent 01b022b1e7
commit 99ee706c18
56 changed files with 488 additions and 486 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@@ -25,6 +25,8 @@ module.exports = {
"max-len": [ "warn", { "code": 250 } ], "max-len": [ "warn", { "code": 250 } ],
"indent": [ "error", 2 ], "indent": [ "error", 2 ],
"no-var": "error", "no-var": "error",
/** @todo this rule should be actived. needs some courage as this rule is broken in many places... */
"one-var": [ "error", "never" ],
/** @todo jsdoc should be made warn or error */ /** @todo jsdoc should be made warn or error */
"valid-jsdoc": "off", "valid-jsdoc": "off",
/** @todo cognitive complexity should be much lower (25-50?) */ /** @todo cognitive complexity should be much lower (25-50?) */

2
cypress/integration/unit/draw.js
View File

@@ -125,7 +125,7 @@ describe('draw.Drawing', function () {
while (svgElem.firstChild) { svgElem.firstChild.remove(); } while (svgElem.firstChild) { svgElem.firstChild.remove(); }
}; };
let sandbox, currentDrawing_, svg, svgN; let sandbox; let currentDrawing_; let svg; let svgN;
beforeEach(() => { beforeEach(() => {
sandbox = document.createElement('div'); sandbox = document.createElement('div');
sandbox.id = 'sandbox'; sandbox.id = 'sandbox';

18
cypress/integration/unit/math.js
View File

@@ -54,25 +54,25 @@ describe('math', function () {
const { isIdentity } = math; const { isIdentity } = math;
// translate there and back // translate there and back
const tr1 = svg.createSVGMatrix().translate(100, 50), const tr1 = svg.createSVGMatrix().translate(100, 50);
tr2 = svg.createSVGMatrix().translate(-90, 0), const tr2 = svg.createSVGMatrix().translate(-90, 0);
tr3 = svg.createSVGMatrix().translate(-10, -50); const tr3 = svg.createSVGMatrix().translate(-10, -50);
let I = mult(tr1, tr2, tr3); let I = mult(tr1, tr2, tr3);
assert.ok(isIdentity(I), 'Expected identity matrix when translating there and back'); assert.ok(isIdentity(I), 'Expected identity matrix when translating there and back');
// rotate there and back // rotate there and back
// TODO: currently Mozilla fails this when rotating back at -50 and then -40 degrees // TODO: currently Mozilla fails this when rotating back at -50 and then -40 degrees
// (b and c are *almost* zero, but not zero) // (b and c are *almost* zero, but not zero)
const rotThere = svg.createSVGMatrix().rotate(90), const rotThere = svg.createSVGMatrix().rotate(90);
rotBack = svg.createSVGMatrix().rotate(-90), // TODO: set this to -50 const rotBack = svg.createSVGMatrix().rotate(-90); // TODO: set this to -50
rotBackMore = svg.createSVGMatrix().rotate(0); // TODO: set this to -40 const rotBackMore = svg.createSVGMatrix().rotate(0); // TODO: set this to -40
I = mult(rotThere, rotBack, rotBackMore); I = mult(rotThere, rotBack, rotBackMore);
assert.ok(isIdentity(I), 'Expected identity matrix when rotating there and back'); assert.ok(isIdentity(I), 'Expected identity matrix when rotating there and back');
// scale up and down // scale up and down
const scaleUp = svg.createSVGMatrix().scale(4), const scaleUp = svg.createSVGMatrix().scale(4);
scaleDown = svg.createSVGMatrix().scaleNonUniform(0.25, 1), const scaleDown = svg.createSVGMatrix().scaleNonUniform(0.25, 1);
scaleDownMore = svg.createSVGMatrix().scaleNonUniform(1, 0.25); const scaleDownMore = svg.createSVGMatrix().scaleNonUniform(1, 0.25);
I = mult(scaleUp, scaleDown, scaleDownMore); I = mult(scaleUp, scaleDown, scaleDownMore);
assert.ok(isIdentity(I), 'Expected identity matrix when scaling up and down'); assert.ok(isIdentity(I), 'Expected identity matrix when scaling up and down');

24
cypress/integration/unit/svgtransformlist.js
View File

@@ -13,7 +13,7 @@ chai.use(expectOutOfBoundsExceptionPlugin);
describe('svgtransformlist', function () { describe('svgtransformlist', function () {
disableSupportsNativeTransformLists(); disableSupportsNativeTransformLists();
let svgroot, svgcontent, rect, circle; let svgroot; let svgcontent; let rect; let circle;
/** /**
* Set up tests, adding elements. * Set up tests, adding elements.
@@ -93,9 +93,9 @@ describe('svgtransformlist', function () {
const rxform = transformlist.getTransformList(rect); const rxform = transformlist.getTransformList(rect);
const cxform = transformlist.getTransformList(circle); const cxform = transformlist.getTransformList(circle);
const t1 = svgcontent.createSVGTransform(), const t1 = svgcontent.createSVGTransform();
t2 = svgcontent.createSVGTransform(), const t2 = svgcontent.createSVGTransform();
t3 = svgcontent.createSVGTransform(); const t3 = svgcontent.createSVGTransform();
assert.ok(rxform.appendItem); assert.ok(rxform.appendItem);
assert.ok(rxform.getItem); assert.ok(rxform.getItem);
@@ -127,8 +127,8 @@ describe('svgtransformlist', function () {
it('Test SVGTransformList.removeItem()', function () { it('Test SVGTransformList.removeItem()', function () {
const rxform = transformlist.getTransformList(rect); const rxform = transformlist.getTransformList(rect);
const t1 = svgcontent.createSVGTransform(), const t1 = svgcontent.createSVGTransform();
t2 = svgcontent.createSVGTransform(); const t2 = svgcontent.createSVGTransform();
assert.ok(rxform.removeItem); assert.ok(rxform.removeItem);
assert.equal(typeof rxform.removeItem, typeof function () { /* empty fn */ }); assert.equal(typeof rxform.removeItem, typeof function () { /* empty fn */ });
rxform.appendItem(t1); rxform.appendItem(t1);
@@ -150,9 +150,9 @@ describe('svgtransformlist', function () {
assert.ok(rxform.replaceItem); assert.ok(rxform.replaceItem);
assert.equal(typeof rxform.replaceItem, typeof function () { /* empty fn */ }); assert.equal(typeof rxform.replaceItem, typeof function () { /* empty fn */ });
const t1 = svgcontent.createSVGTransform(), const t1 = svgcontent.createSVGTransform();
t2 = svgcontent.createSVGTransform(), const t2 = svgcontent.createSVGTransform();
t3 = svgcontent.createSVGTransform(); const t3 = svgcontent.createSVGTransform();
rxform.appendItem(t1); rxform.appendItem(t1);
rxform.appendItem(t2); rxform.appendItem(t2);
@@ -182,9 +182,9 @@ describe('svgtransformlist', function () {
assert.ok(rxform.insertItemBefore); assert.ok(rxform.insertItemBefore);
assert.equal(typeof rxform.insertItemBefore, typeof function () { /* empty fn */ }); assert.equal(typeof rxform.insertItemBefore, typeof function () { /* empty fn */ });
const t1 = svgcontent.createSVGTransform(), const t1 = svgcontent.createSVGTransform();
t2 = svgcontent.createSVGTransform(), const t2 = svgcontent.createSVGTransform();
t3 = svgcontent.createSVGTransform(); const t3 = svgcontent.createSVGTransform();
rxform.appendItem(t1); rxform.appendItem(t1);
rxform.appendItem(t2); rxform.appendItem(t2);

40
cypress/integration/unit/test1.js
View File

@@ -20,8 +20,8 @@ describe('Basic Module', function () {
const const
// svgroot = document.getElementById('svgroot'), // svgroot = document.getElementById('svgroot'),
// svgdoc = svgroot.documentElement, // svgdoc = svgroot.documentElement,
svgns = 'http://www.w3.org/2000/svg', svgns = 'http://www.w3.org/2000/svg';
xlinkns = 'http://www.w3.org/1999/xlink'; const xlinkns = 'http://www.w3.org/1999/xlink';
beforeEach(() => { beforeEach(() => {
document.body.textContent = ''; document.body.textContent = '';
@@ -83,10 +83,10 @@ describe('Basic Module', function () {
'</svg>' '</svg>'
); );
const p1 = document.getElementById('p1'), const p1 = document.getElementById('p1');
p2 = document.getElementById('p2'), const p2 = document.getElementById('p2');
dAbs = p1.getAttribute('d'), const dAbs = p1.getAttribute('d');
seglist = p1.pathSegList; const seglist = p1.pathSegList;
assert.equal(p1.nodeName, 'path', "Expected 'path', got"); assert.equal(p1.nodeName, 'path', "Expected 'path', got");
@@ -123,9 +123,9 @@ describe('Basic Module', function () {
'</svg>' '</svg>'
); );
const u = document.getElementById('the-use'), const u = document.getElementById('the-use');
fu = document.getElementById('foreign-use'), const fu = document.getElementById('foreign-use');
nfu = document.getElementById('no-use'); const nfu = document.getElementById('no-use');
assert.equal((u && u.nodeName), 'use', 'Did not import <use> element'); assert.equal((u && u.nodeName), 'use', 'Did not import <use> element');
assert.equal(fu, null, 'Removed <use> element that had a foreign href'); assert.equal(fu, null, 'Removed <use> element that had a foreign href');
@@ -211,10 +211,10 @@ describe('Basic Module', function () {
'</svg>' '</svg>'
); );
const svgcontent = document.getElementById('svgcontent'), const svgcontent = document.getElementById('svgcontent');
circles = svgcontent.getElementsByTagNameNS(svgns, 'circle'), const circles = svgcontent.getElementsByTagNameNS(svgns, 'circle');
rects = svgcontent.getElementsByTagNameNS(svgns, 'rect'), const rects = svgcontent.getElementsByTagNameNS(svgns, 'rect');
ellipses = svgcontent.getElementsByTagNameNS(svgns, 'ellipse'); const ellipses = svgcontent.getElementsByTagNameNS(svgns, 'ellipse');
assert.equal(circles.length, 2, 'Found two circles upon importing'); assert.equal(circles.length, 2, 'Found two circles upon importing');
assert.equal(rects.length, 1, 'Found one rectangle upon importing'); assert.equal(rects.length, 1, 'Found one rectangle upon importing');
assert.equal(ellipses.length, 1, 'Found one ellipse upon importing'); assert.equal(ellipses.length, 1, 'Found one ellipse upon importing');
@@ -245,13 +245,13 @@ describe('Basic Module', function () {
'</svg>' '</svg>'
); );
const svgcontent = document.getElementById('svgcontent'), const svgcontent = document.getElementById('svgcontent');
circles = svgcontent.getElementsByTagNameNS(svgns, 'circle'), const circles = svgcontent.getElementsByTagNameNS(svgns, 'circle');
rects = svgcontent.getElementsByTagNameNS(svgns, 'rect'), const rects = svgcontent.getElementsByTagNameNS(svgns, 'rect');
// ellipses = svgcontent.getElementsByTagNameNS(svgns, 'ellipse'), // ellipses = svgcontent.getElementsByTagNameNS(svgns, 'ellipse'),
defs = svgcontent.getElementsByTagNameNS(svgns, 'defs'), const defs = svgcontent.getElementsByTagNameNS(svgns, 'defs');
// grads = svgcontent.getElementsByTagNameNS(svgns, 'linearGradient'), // grads = svgcontent.getElementsByTagNameNS(svgns, 'linearGradient'),
uses = svgcontent.getElementsByTagNameNS(svgns, 'use'); const uses = svgcontent.getElementsByTagNameNS(svgns, 'use');
assert.notEqual(circles.item(0).id, 'svg_1', 'Circle not re-identified'); assert.notEqual(circles.item(0).id, 'svg_1', 'Circle not re-identified');
assert.notEqual(rects.item(0).id, 'svg_3', 'Rectangle not re-identified'); assert.notEqual(rects.item(0).id, 'svg_3', 'Rectangle not re-identified');
// TODO: determine why this test fails in WebKit browsers // TODO: determine why this test fails in WebKit browsers

2
cypress/integration/unit/utilities-bbox.js
View File

@@ -56,7 +56,7 @@ describe('utilities bbox', function () {
if (type === 1) { continue; } if (type === 1) { continue; }
const pts = []; const pts = [];
[ '', 1, 2 ].forEach(function (n) { [ '', 1, 2 ].forEach(function (n) {
const x = seg['x' + n], y = seg['y' + n]; const x = seg['x' + n]; const y = seg['y' + n];
if (x !== undefined && y !== undefined) { if (x !== undefined && y !== undefined) {
const pt = math.transformPoint(x, y, m); const pt = math.transformPoint(x, y, m);
pts.splice(pts.length, 0, pt.x, pt.y); pts.splice(pts.length, 0, pt.x, pt.y);

14
cypress/integration/unit/utilities-performance.js
View File

@@ -9,7 +9,7 @@ import * as transformlist from '../../../instrumented/svgcanvas/svgtransformlist
import * as math from '../../../instrumented/svgcanvas/math.js'; import * as math from '../../../instrumented/svgcanvas/math.js';
describe('utilities performance', function () { describe('utilities performance', function () {
let currentLayer, groupWithMatrixTransform, textWithMatrixTransform; let currentLayer; let groupWithMatrixTransform; let textWithMatrixTransform;
beforeEach(() => { beforeEach(() => {
document.body.textContent = ''; document.body.textContent = '';
const style = document.createElement('style'); const style = document.createElement('style');
@@ -137,8 +137,8 @@ describe('utilities performance', function () {
} }
const pts = []; const pts = [];
[ '', 1, 2 ].forEach(function (n) { [ '', 1, 2 ].forEach(function (n) {
const x = seg['x' + n], const x = seg['x' + n];
y = seg['y' + n]; const y = seg['y' + n];
if (x !== undefined && y !== undefined) { if (x !== undefined && y !== undefined) {
const pt = math.transformPoint(x, y, m); const pt = math.transformPoint(x, y, m);
pts.splice(pts.length, 0, pt.x, pt.y); pts.splice(pts.length, 0, pt.x, pt.y);
@@ -187,10 +187,10 @@ describe('utilities performance', function () {
const { getStrokedBBox } = utilities; const { getStrokedBBox } = utilities;
const { children } = currentLayer; const { children } = currentLayer;
let lastTime, now, let lastTime; let now;
min = Number.MAX_VALUE, let min = Number.MAX_VALUE;
max = 0, let max = 0;
total = 0; let total = 0;
fillDocumentByCloningElement(groupWithMatrixTransform, 50); fillDocumentByCloningElement(groupWithMatrixTransform, 50);
fillDocumentByCloningElement(textWithMatrixTransform, 50); fillDocumentByCloningElement(textWithMatrixTransform, 50);

2
cypress/integration/unit/utilities.js
View File

@@ -79,7 +79,7 @@ describe('utilities', function () {
mockCount.addCommandToHistory++; mockCount.addCommandToHistory++;
} }
let svg, svgroot; let svg; let svgroot;
beforeEach(() => { beforeEach(() => {
document.body.textContent = ''; document.body.textContent = '';

12
cypress/support/assert-close.js
View File

@@ -22,8 +22,8 @@ import assertionWrapper from './assertion-wrapper.js';
* @returns {InfoObject} * @returns {InfoObject}
*/ */
function close (actual, expected, maxDifference, message) { function close (actual, expected, maxDifference, message) {
const actualDiff = (actual === expected) ? 0 : Math.abs(actual - expected), const actualDiff = (actual === expected) ? 0 : Math.abs(actual - expected);
result = actualDiff <= maxDifference; const result = actualDiff <= maxDifference;
message = message || (actual + ' should be within ' + maxDifference + ' (inclusive) of ' + expected + (result ? '' : '. Actual: ' + actualDiff)); message = message || (actual + ' should be within ' + maxDifference + ' (inclusive) of ' + expected + (result ? '' : '. Actual: ' + actualDiff));
return { result, message, actual, expected }; return { result, message, actual, expected };
} }
@@ -41,7 +41,7 @@ function close (actual, expected, maxDifference, message) {
* @returns {InfoObject} * @returns {InfoObject}
*/ */
function closePercent (actual, expected, maxPercentDifference, message) { function closePercent (actual, expected, maxPercentDifference, message) {
let actualDiff, result; let actualDiff; let result;
if (actual === expected) { if (actual === expected) {
actualDiff = 0; actualDiff = 0;
result = actualDiff <= maxPercentDifference; result = actualDiff <= maxPercentDifference;
@@ -71,8 +71,8 @@ function closePercent (actual, expected, maxPercentDifference, message) {
* @returns {InfoObject} * @returns {InfoObject}
*/ */
function notClose (actual, expected, minDifference, message) { function notClose (actual, expected, minDifference, message) {
const actualDiff = Math.abs(actual - expected), const actualDiff = Math.abs(actual - expected);
result = actualDiff > minDifference; const result = actualDiff > minDifference;
message = message || (actual + ' should not be within ' + minDifference + ' (exclusive) of ' + expected + (result ? '' : '. Actual: ' + actualDiff)); message = message || (actual + ' should not be within ' + minDifference + ' (exclusive) of ' + expected + (result ? '' : '. Actual: ' + actualDiff));
return { result, message, actual, expected }; return { result, message, actual, expected };
} }
@@ -90,7 +90,7 @@ function notClose (actual, expected, minDifference, message) {
* @returns {InfoObject} * @returns {InfoObject}
*/ */
function notClosePercent (actual, expected, minPercentDifference, message) { function notClosePercent (actual, expected, minPercentDifference, message) {
let actualDiff, result; let actualDiff; let result;
if (actual === expected) { if (actual === expected) {
actualDiff = 0; actualDiff = 0;
result = actualDiff > minPercentDifference; result = actualDiff > minPercentDifference;

12
src/editor/Editor.js
View File

@@ -453,8 +453,8 @@ class Editor extends EditorStartup {
const wArea = this.workarea; const wArea = this.workarea;
const cnvs = $id("svgcanvas"); const cnvs = $id("svgcanvas");
let w = parseFloat(getComputedStyle(this.workarea, null).width.replace("px", "")), h = parseFloat(getComputedStyle(this.workarea, null).height.replace("px", "")); let w = parseFloat(getComputedStyle(this.workarea, null).width.replace("px", "")); let h = parseFloat(getComputedStyle(this.workarea, null).height.replace("px", ""));
const wOrig = w, hOrig = h; const wOrig = w; const hOrig = h;
const oldCtr = { const oldCtr = {
x: wArea.scrollLeft + wOrig / 2, x: wArea.scrollLeft + wOrig / 2,
y: wArea.scrollTop + hOrig / 2 y: wArea.scrollTop + hOrig / 2
@@ -700,12 +700,12 @@ class Editor extends EditorStartup {
* @returns {void} * @returns {void}
*/ */
zoomChanged(win, bbox, autoCenter) { zoomChanged(win, bbox, autoCenter) {
const scrbar = 15, const scrbar = 15;
wArea = this.workarea; const wArea = this.workarea;
const zInfo = this.svgCanvas.setBBoxZoom(bbox, parseFloat(getComputedStyle(wArea, null).width.replace("px", "")) - scrbar, parseFloat(getComputedStyle(wArea, null).height.replace("px", "")) - scrbar); const zInfo = this.svgCanvas.setBBoxZoom(bbox, parseFloat(getComputedStyle(wArea, null).width.replace("px", "")) - scrbar, parseFloat(getComputedStyle(wArea, null).height.replace("px", "")) - scrbar);
if (!zInfo) { return; } if (!zInfo) { return; }
const zoomlevel = zInfo.zoom, const zoomlevel = zInfo.zoom;
bb = zInfo.bbox; const bb = zInfo.bbox;
if (zoomlevel < 0.001) { if (zoomlevel < 0.001) {
this.changeZoom(0.1); this.changeZoom(0.1);

4
src/editor/EditorStartup.js
View File

@@ -282,8 +282,8 @@ class EditorStartup {
const wArea = this.workarea; const wArea = this.workarea;
let lastX = null, lastY = null, let lastX = null; let lastY = null;
panning = false, keypan = false; let panning = false; let keypan = false;
$id('svgcanvas').addEventListener('mouseup', function(evt) { $id('svgcanvas').addEventListener('mouseup', function(evt) {
if (panning === false) { return true; } if (panning === false) { return true; }

2
src/editor/MainMenu.js
View File

@@ -168,7 +168,7 @@ class MainMenu {
} }
this.editor.exportWindowName = this.editor.exportWindowName =
this.editor.configObj.curConfig.canvasName + this.editor.exportWindowCt; this.editor.configObj.curConfig.canvasName + this.editor.exportWindowCt;
let popHTML, popURL; let popHTML; let popURL;
if (this.editor.loadingURL) { if (this.editor.loadingURL) {
popURL = this.editor.loadingURL; popURL = this.editor.loadingURL;
} else { } else {

4
src/editor/Rulers.js
View File

@@ -40,7 +40,7 @@ class Rulers {
if (!zoom) { zoom = this.svgCanvas.getZoom(); } if (!zoom) { zoom = this.svgCanvas.getZoom(); }
if (!scanvas) { scanvas = document.getElementById('svgcanvas'); } if (!scanvas) { scanvas = document.getElementById('svgcanvas'); }
let d, i; let d; let i;
const limit = 30000; const limit = 30000;
const contentElem = this.svgCanvas.getContentElem(); const contentElem = this.svgCanvas.getContentElem();
const units = getTypeMap(); const units = getTypeMap();
@@ -72,7 +72,7 @@ class Rulers {
const totalLen = rulerLen; const totalLen = rulerLen;
hcanv.parentNode.style[lentype] = totalLen + 'px'; hcanv.parentNode.style[lentype] = totalLen + 'px';
let ctx = hcanv.getContext('2d'); let ctx = hcanv.getContext('2d');
let ctxArr, num, ctxArrNum; let ctxArr; let num; let ctxArrNum;
ctx.fillStyle = 'rgb(200,0,0)'; ctx.fillStyle = 'rgb(200,0,0)';
ctx.fillRect(0, 0, hcanv.width, hcanv.height); ctx.fillRect(0, 0, hcanv.width, hcanv.height);

18
src/editor/components/jgraduate/ColorValuePicker.js
View File

@@ -340,15 +340,15 @@ export default class ColorValuePicker {
ahex = null; ahex = null;
} }
let let
red = inputs[3], red = inputs[3];
green = inputs[4], let green = inputs[4];
blue = inputs[5], let blue = inputs[5];
alpha = inputs.length > 7 ? inputs[6] : null, let alpha = inputs.length > 7 ? inputs[6] : null;
hue = inputs[0], let hue = inputs[0];
saturation = inputs[1], let saturation = inputs[1];
value = inputs[2], let value = inputs[2];
hex = inputs[(inputs.length > 7) ? 7 : 6], let hex = inputs[(inputs.length > 7) ? 7 : 6];
ahex = inputs.length > 7 ? inputs[8] : null; let ahex = inputs.length > 7 ? inputs[8] : null;
Object.assign(that, { destroy }); Object.assign(that, { destroy });
red.addEventListener('keyup', keyUp); red.addEventListener('keyup', keyUp);
green.addEventListener('keyup', keyUp); green.addEventListener('keyup', keyUp);

54
src/editor/components/jgraduate/Slider.js
View File

@@ -82,10 +82,10 @@ export default class Slider {
* @returns {void} * @returns {void}
*/ */
function setValuesFromMousePosition (e) { function setValuesFromMousePosition (e) {
const barW = bar.w, // local copies for YUI compressor const barW = bar.w; // local copies for YUI compressor
barH = bar.h; const barH = bar.h;
let locX = e.pageX - offset.l, let locX = e.pageX - offset.l;
locY = e.pageY - offset.t; let locY = e.pageY - offset.t;
// keep the arrow within the bounds of the bar // keep the arrow within the bounds of the bar
if (locX < 0) locX = 0; if (locX < 0) locX = 0;
else if (locX > barW) locX = barW; else if (locX > barW) locX = barW;
@@ -102,12 +102,12 @@ export default class Slider {
*/ */
function draw () { function draw () {
const const
barW = bar.w, barW = bar.w;
barH = bar.h, const barH = bar.h;
arrowW = arrow.w, const arrowW = arrow.w;
arrowH = arrow.h; const arrowH = arrow.h;
let arrowOffsetX = 0, let arrowOffsetX = 0;
arrowOffsetY = 0; let arrowOffsetY = 0;
setTimeout(function () { setTimeout(function () {
if (rangeX > 0) { // range is greater than zero if (rangeX > 0) { // range is greater than zero
// constrain to bounds // constrain to bounds
@@ -152,7 +152,7 @@ export default class Slider {
if (!isNullish(context) && context === that) return undefined; if (!isNullish(context) && context === that) return undefined;
let changed = false; let changed = false;
let newX, newY; let newX; let newY;
if (isNullish(name)) name = 'xy'; if (isNullish(name)) name = 'xy';
switch (name.toLowerCase()) { switch (name.toLowerCase()) {
case 'x': case 'x':
@@ -225,10 +225,10 @@ export default class Slider {
} }
} }
let // changed = false, let // changed = false,
newMinX, newMinX;
newMaxX, let newMaxX;
newMinY, let newMinY;
newMaxY; let newMaxY;
if (isNullish(name)) name = 'all'; if (isNullish(name)) name = 'all';
switch (name.toLowerCase()) { switch (name.toLowerCase()) {
case 'minx': case 'minx':
@@ -307,18 +307,18 @@ export default class Slider {
arrow = null; arrow = null;
changeEvents = null; changeEvents = null;
} }
let offset, let offset;
timeout, let timeout;
x = 0, let x = 0;
y = 0, let y = 0;
minX = 0, let minX = 0;
maxX = 100, let maxX = 100;
rangeX = 100, let rangeX = 100;
minY = 0, let minY = 0;
maxY = 100, let maxY = 100;
rangeY = 100, let rangeY = 100;
arrow = bar.querySelector('img'), // the arrow image to drag let arrow = bar.querySelector('img'); // the arrow image to drag
changeEvents = []; let changeEvents = [];
Object.assign(that, { Object.assign(that, {
val, val,
range, range,

2
src/editor/components/jgraduate/Util.js
View File

@@ -46,7 +46,7 @@ export function mergeDeep(target, source) {
export function getClosest(elem, selector) { export function getClosest(elem, selector) {
const firstChar = selector.charAt(0); const firstChar = selector.charAt(0);
const supports = 'classList' in document.documentElement; const supports = 'classList' in document.documentElement;
let attribute, value; let attribute; let value;
// If selector is a data attribute, split attribute from value // If selector is a data attribute, split attribute from value
if (firstChar === '[') { if (firstChar === '[') {
selector = selector.substr(1, selector.length - 2); selector = selector.substr(1, selector.length - 2);

44
src/editor/components/jgraduate/jQuery.jGraduate.js
View File

@@ -189,10 +189,10 @@ function mkElem (name, attrs, newparent) {
* @returns {external:jQuery} * @returns {external:jQuery}
*/ */
export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18next) { export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18next) {
const $this = elem, const $this = elem;
$settings = Object.assign({}, jGraduateDefaults, options || {}), const $settings = Object.assign({}, jGraduateDefaults, options || {});
id = $this.getAttribute('id'), const id = $this.getAttribute('id');
idref = '#' + $this.getAttribute('id') + ' '; const idref = '#' + $this.getAttribute('id') + ' ';
if (!idref) { if (!idref) {
// eslint-disable-next-line no-alert // eslint-disable-next-line no-alert
@@ -346,12 +346,12 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
/* eslint-enable max-len */ /* eslint-enable max-len */
// -------------- // --------------
// Set up all the SVG elements (the gradient, stops and rectangle) // Set up all the SVG elements (the gradient, stops and rectangle)
const MAX = 256, const MAX = 256;
MARGINX = 0, const MARGINX = 0;
MARGINY = 0, const MARGINY = 0;
// STOP_RADIUS = 15 / 2, // STOP_RADIUS = 15 / 2,
SIZEX = MAX - 2 * MARGINX, const SIZEX = MAX - 2 * MARGINX;
SIZEY = MAX - 2 * MARGINY; const SIZEY = MAX - 2 * MARGINY;
const attrInput = {}; const attrInput = {};
@@ -448,15 +448,15 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
} }
} }
const x1 = Number.parseFloat(grad.getAttribute('x1') || 0.0), const x1 = Number.parseFloat(grad.getAttribute('x1') || 0.0);
y1 = Number.parseFloat(grad.getAttribute('y1') || 0.0), const y1 = Number.parseFloat(grad.getAttribute('y1') || 0.0);
x2 = Number.parseFloat(grad.getAttribute('x2') || 1.0), const x2 = Number.parseFloat(grad.getAttribute('x2') || 1.0);
y2 = Number.parseFloat(grad.getAttribute('y2') || 0.0); const y2 = Number.parseFloat(grad.getAttribute('y2') || 0.0);
const cx = Number.parseFloat(grad.getAttribute('cx') || 0.5), const cx = Number.parseFloat(grad.getAttribute('cx') || 0.5);
cy = Number.parseFloat(grad.getAttribute('cy') || 0.5), const cy = Number.parseFloat(grad.getAttribute('cy') || 0.5);
fx = Number.parseFloat(grad.getAttribute('fx') || cx), const fx = Number.parseFloat(grad.getAttribute('fx') || cx);
fy = Number.parseFloat(grad.getAttribute('fy') || cy); const fy = Number.parseFloat(grad.getAttribute('fy') || cy);
const previewRect = mkElem('rect', { const previewRect = mkElem('rect', {
id: id + '_jgraduate_rect', id: id + '_jgraduate_rect',
@@ -676,7 +676,7 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
const stopMakerDiv = $this.querySelector('#' + id + '_jGraduate_StopSlider'); const stopMakerDiv = $this.querySelector('#' + id + '_jGraduate_StopSlider');
let stops, curStop, drag; let stops; let curStop; let drag;
const delStop = mkElem('path', { const delStop = mkElem('path', {
d: 'm9.75,-6l-19.5,19.5m0,-19.5l19.5,19.5', d: 'm9.75,-6l-19.5,19.5m0,-19.5l19.5,19.5',
@@ -710,7 +710,7 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
drag = null; drag = null;
} }
let scaleX = 1, scaleY = 1, angle = 0; let scaleX = 1; let scaleY = 1; let angle = 0;
let cX = cx; let cX = cx;
let cY = cy; let cY = cy;
@@ -946,7 +946,7 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
$this.querySelector('#' + id + '_jGraduate_match_ctr').checked = !showFocus; $this.querySelector('#' + id + '_jGraduate_match_ctr').checked = !showFocus;
let lastfx, lastfy; let lastfx; let lastfy;
const onMatchCtrHandler = (e) => { const onMatchCtrHandler = (e) => {
showFocus = !e.target.checked; showFocus = !e.target.checked;
if (showFocus) { if (showFocus) {
@@ -1034,7 +1034,7 @@ export function jGraduateMethod (elem, options, okCallback, cancelCallback, i18n
slider.input.value = x; slider.input.value = x;
}; };
let ellipVal = 0, angleVal = 0; let ellipVal = 0; let angleVal = 0;
if (curType === 'radialGradient') { if (curType === 'radialGradient') {
const tlist = curGradient.gradientTransform.baseVal; const tlist = curGradient.gradientTransform.baseVal;

108
src/editor/components/jgraduate/jQuery.jPicker.js
View File

@@ -227,7 +227,7 @@ export const jPicker = /** @lends external:jQuery.jPicker */ {
return undefined; return undefined;
} }
const newV = {}; const newV = {};
let rgb = false, hsv = false; let rgb = false; let hsv = false;
if (value.r !== undefined && !name.includes('r')) name += 'r'; if (value.r !== undefined && !name.includes('r')) name += 'r';
if (value.g !== undefined && !name.includes('g')) name += 'g'; if (value.g !== undefined && !name.includes('g')) name += 'g';
if (value.b !== undefined && !name.includes('b')) name += 'b'; if (value.b !== undefined && !name.includes('b')) name += 'b';
@@ -361,7 +361,7 @@ export const jPicker = /** @lends external:jQuery.jPicker */ {
function destroy () { function destroy () {
changeEvents = null; changeEvents = null;
} }
let r, g, b, a, h, s, v, changeEvents = []; let r; let g; let b; let a; let h; let s; let v; let changeEvents = [];
Object.assign(that, { Object.assign(that, {
// public properties and methods // public properties and methods
val, val,
@@ -411,7 +411,7 @@ export const jPicker = /** @lends external:jQuery.jPicker */ {
hexToRgba (hex) { hexToRgba (hex) {
if (hex === '' || hex === 'none') return { r: null, g: null, b: null, a: null }; if (hex === '' || hex === 'none') return { r: null, g: null, b: null, a: null };
hex = this.validateHex(hex); hex = this.validateHex(hex);
let r = '00', g = '00', b = '00', a = '255'; let r = '00'; let g = '00'; let b = '00'; let a = '255';
if (hex.length === 6) hex += 'ff'; if (hex.length === 6) hex += 'ff';
if (hex.length > 6) { if (hex.length > 6) {
r = hex.substring(0, 2); r = hex.substring(0, 2);
@@ -477,8 +477,8 @@ export const jPicker = /** @lends external:jQuery.jPicker */ {
* @returns {module:jPicker.HSV} * @returns {module:jPicker.HSV}
*/ */
rgbToHsv (rgb) { rgbToHsv (rgb) {
const r = rgb.r / 255, g = rgb.g / 255, b = rgb.b / 255, hsv = { h: 0, s: 0, v: 0 }; const r = rgb.r / 255; const g = rgb.g / 255; const b = rgb.b / 255; const hsv = { h: 0, s: 0, v: 0 };
let min = 0, max = 0; let min = 0; let max = 0;
if (r >= g && r >= b) { if (r >= g && r >= b) {
max = r; max = r;
min = g > b ? b : g; min = g > b ? b : g;
@@ -520,11 +520,11 @@ export const jPicker = /** @lends external:jQuery.jPicker */ {
h /= 60; h /= 60;
s /= 100; s /= 100;
v /= 100; v /= 100;
const i = h | 0, const i = h | 0;
f = h - i, const f = h - i;
p = v * (1 - s), const p = v * (1 - s);
q = v * (1 - (s * f)), const q = v * (1 - (s * f));
t = v * (1 - (s * (1 - f))); const t = v * (1 - (s * (1 - f)));
switch (i) { switch (i) {
case 0: case 0:
rgb.r = v; rgb.r = v;
@@ -607,8 +607,8 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
let sets = mergeDeep({}, jPickerDefaults); // local copies for YUI compressor let sets = mergeDeep({}, jPickerDefaults); // local copies for YUI compressor
sets = mergeDeep(sets, options); sets = mergeDeep(sets, options);
const that = elem, const that = elem;
settings = sets; const settings = sets;
if (that.nodeName.toLowerCase() === 'input') { // Add color picker icon if binding to an input element and bind the events to the input if (that.nodeName.toLowerCase() === 'input') { // Add color picker icon if binding to an input element and bind the events to the input
Object.assign(settings, { Object.assign(settings, {
window: { window: {
@@ -648,10 +648,10 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
* @returns {void} * @returns {void}
*/ */
function setColorMode (colorMode) { function setColorMode (colorMode) {
const { active } = color, // local copies for YUI compressor const { active } = color; // local copies for YUI compressor
// {clientPath} = images, // {clientPath} = images,
hex = active.val('hex'); const hex = active.val('hex');
let rgbMap, rgbBar; let rgbMap; let rgbBar;
settings.color.mode = colorMode; settings.color.mode = colorMode;
switch (colorMode) { switch (colorMode) {
case 'h': case 'h':
@@ -1000,15 +1000,15 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - (a || 0)) * 100) / 255, 4)); setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - (a || 0)) * 100) / 255, 4));
break; break;
} case 's': { } case 's': {
const hva = ui.val('hva'), const hva = ui.val('hva');
saturatedColor = new Color({ h: (hva && hva.h) || 0, s: 100, v: !isNullish(hva) ? hva.v : 100 }); const saturatedColor = new Color({ h: (hva && hva.h) || 0, s: 100, v: !isNullish(hva) ? hva.v : 100 });
setBG.call(that, colorBarDiv, saturatedColor.val('hex')); setBG.call(that, colorBarDiv, saturatedColor.val('hex'));
setAlpha.call(that, colorBarL2, 100 - (!isNullish(hva) ? hva.v : 100)); setAlpha.call(that, colorBarL2, 100 - (!isNullish(hva) ? hva.v : 100));
setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - ((hva && hva.a) || 0)) * 100) / 255, 4)); setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - ((hva && hva.a) || 0)) * 100) / 255, 4));
break; break;
} case 'v': { } case 'v': {
const hsa = ui.val('hsa'), const hsa = ui.val('hsa');
valueColor = new Color({ h: (hsa && hsa.h) || 0, s: !isNullish(hsa) ? hsa.s : 100, v: 100 }); const valueColor = new Color({ h: (hsa && hsa.h) || 0, s: !isNullish(hsa) ? hsa.s : 100, v: 100 });
setBG.call(that, colorBarDiv, valueColor.val('hex')); setBG.call(that, colorBarDiv, valueColor.val('hex'));
setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - ((hsa && hsa.a) || 0)) * 100) / 255, 4)); setAlpha.call(that, colorBarL5, toFixedNumeric(((255 - ((hsa && hsa.a) || 0)) * 100) / 255, 4));
break; break;
@@ -1016,7 +1016,7 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
case 'g': case 'g':
case 'b': { case 'b': {
const rgba = ui.val('rgba'); const rgba = ui.val('rgba');
let hValue = 0, vValue = 0; let hValue = 0; let vValue = 0;
if (settings.color.mode === 'r') { if (settings.color.mode === 'r') {
hValue = (rgba && rgba.b) || 0; hValue = (rgba && rgba.b) || 0;
vValue = (rgba && rgba.g) || 0; vValue = (rgba && rgba.g) || 0;
@@ -1309,8 +1309,8 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
*/ */
function initialize () { function initialize () {
const nexts = that.nextElementSibling; const nexts = that.nextElementSibling;
const win = settings.window, const win = settings.window;
popup = win.expandable ? nexts.querySelector('#Container') : null; const popup = win.expandable ? nexts.querySelector('#Container') : null;
container = win.expandable ? document.createElement('div') : that; container = win.expandable ? document.createElement('div') : that;
container.classList.add('jPicker'); container.classList.add('jPicker');
container.classList.add('Container'); container.classList.add('Container');
@@ -1454,9 +1454,9 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
win.expandable && win.bindToInput ? win.input : null, win.expandable && win.bindToInput ? win.input : null,
win.alphaPrecision win.alphaPrecision
); );
const hex = !isNullish(all) ? all.hex : null, const hex = !isNullish(all) ? all.hex : null;
preview = tbody.querySelector('#Preview'), const preview = tbody.querySelector('#Preview');
button = tbody.querySelector('#Button'); const button = tbody.querySelector('#Button');
activePreview = preview.querySelector('#Active'); activePreview = preview.querySelector('#Active');
activePreview.style.backgroundColor = (hex) ? '#' + hex : 'transparent'; activePreview.style.backgroundColor = (hex) ? '#' + hex : 'transparent';
currentPreview = preview.querySelector('#Current'); currentPreview = preview.querySelector('#Current');
@@ -1625,34 +1625,34 @@ export function jPickerMethod (elem, options, commitCallback, liveCallback, canc
cancelCallback = null; cancelCallback = null;
} }
let elementStartX = null, // Used to record the starting css positions for dragging the control let elementStartX = null; // Used to record the starting css positions for dragging the control
elementStartY = null, let elementStartY = null;
pageStartX = null, // Used to record the mousedown coordinates for dragging the control let pageStartX = null; // Used to record the mousedown coordinates for dragging the control
pageStartY = null, let pageStartY = null;
container = null, let container = null;
colorMapDiv = null, let colorMapDiv = null;
colorBarDiv = null, let colorBarDiv = null;
colorMapL1 = null, // different layers of colorMap and colorBar let colorMapL1 = null; // different layers of colorMap and colorBar
colorMapL2 = null, let colorMapL2 = null;
colorMapL3 = null, let colorMapL3 = null;
colorBarL1 = null, let colorBarL1 = null;
colorBarL2 = null, let colorBarL2 = null;
colorBarL3 = null, let colorBarL3 = null;
colorBarL4 = null, let colorBarL4 = null;
colorBarL5 = null, let colorBarL5 = null;
colorBarL6 = null, let colorBarL6 = null;
colorMap = null, // color maps let colorMap = null; // color maps
colorBar = null, let colorBar = null;
colorPicker = null, let colorPicker = null;
activePreview = null, // color boxes above the radio buttons let activePreview = null; // color boxes above the radio buttons
currentPreview = null, let currentPreview = null;
okButton = null, let okButton = null;
cancelButton = null, let cancelButton = null;
grid = null, // preset colors grid let grid = null; // preset colors grid
iconColor = null, // iconColor for popup icon let iconColor = null; // iconColor for popup icon
iconAlpha = null, // iconAlpha for popup icon let iconAlpha = null; // iconAlpha for popup icon
iconImage = null, // iconImage popup icon let iconImage = null; // iconImage popup icon
moveBar = null; // drag bar let moveBar = null; // drag bar
Object.assign(that, { Object.assign(that, {
// public properties, methods, and callbacks // public properties, methods, and callbacks
commitCallback, // commitCallback function can be overridden to return the selected color to a method you specify when the user clicks "OK" commitCallback, // commitCallback function can be overridden to return the selected color to a method you specify when the user clicks "OK"

12
src/editor/embedapi.js
View File

@@ -23,8 +23,8 @@ let cbid = 0;
*/ */
function getCallbackSetter (funcName) { function getCallbackSetter (funcName) {
return function (...args) { return function (...args) {
const that = this, // New callback const that = this; // New callback
callbackID = this.send(funcName, args, function () { /* empty fn */ }); // The callback (currently it's nothing, but will be set later) const callbackID = this.send(funcName, args, function () { /* empty fn */ }); // The callback (currently it's nothing, but will be set later)
return function (newCallback) { return function (newCallback) {
that.callbacks[callbackID] = newCallback; // Set callback that.callbacks[callbackID] = newCallback; // Set callback
@@ -65,8 +65,8 @@ function messageListener (e) {
if (!e.data || ![ 'string', 'object' ].includes(typeof e.data)) { if (!e.data || ![ 'string', 'object' ].includes(typeof e.data)) {
return; return;
} }
const { allowedOrigins } = this, const { allowedOrigins } = this;
data = typeof e.data === 'object' ? e.data : JSON.parse(e.data); const data = typeof e.data === 'object' ? e.data : JSON.parse(e.data);
if (!data || typeof data !== 'object' || data.namespace !== 'svg-edit' || if (!data || typeof data !== 'object' || data.namespace !== 'svg-edit' ||
e.source !== this.frame.contentWindow || e.source !== this.frame.contentWindow ||
(!allowedOrigins.includes('*') && !allowedOrigins.includes(e.origin)) (!allowedOrigins.includes('*') && !allowedOrigins.includes(e.origin))
@@ -372,8 +372,8 @@ class EmbeddedSVGEdit {
// of the current JSON-based communication API (e.g., not passing // of the current JSON-based communication API (e.g., not passing
// callbacks). We might be able to address these shortcomings; see // callbacks). We might be able to address these shortcomings; see
// the todo elsewhere in this file. // the todo elsewhere in this file.
const message = { id: callbackID }, const message = { id: callbackID };
{ svgEditor: { canvas: svgCanvas } } = that.frame.contentWindow; const { svgEditor: { canvas: svgCanvas } } = that.frame.contentWindow;
try { try {
message.result = svgCanvas[name](...args); message.result = svgCanvas[name](...args);
} catch (err) { } catch (err) {

8
src/editor/extensions/ext-arrows/ext-arrows.js
View File

@@ -29,11 +29,11 @@ export default {
const { svgCanvas } = svgEditor; const { svgCanvas } = svgEditor;
const { $id } = svgCanvas; const { $id } = svgCanvas;
const const
addElem = svgCanvas.addSVGElementFromJson, addElem = svgCanvas.addSVGElementFromJson;
{ nonce } = S, const { nonce } = S;
prefix = 'se_arrow_'; const prefix = 'se_arrow_';
let selElems, arrowprefix, randomizeIds = S.randomize_ids; let selElems; let arrowprefix; let randomizeIds = S.randomize_ids;
/** /**
* @param {Window} win * @param {Window} win

12
src/editor/extensions/ext-closepath/ext-closepath.js
View File

@@ -31,10 +31,10 @@ export default {
const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang')); const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang'));
let selElems; let selElems;
const updateButton = function (path) { const updateButton = function (path) {
const seglist = path.pathSegList, const seglist = path.pathSegList;
closed = seglist.getItem(seglist.numberOfItems - 1).pathSegType === 1, const closed = seglist.getItem(seglist.numberOfItems - 1).pathSegType === 1;
showbutton = closed ? 'tool_openpath' : 'tool_closepath', const showbutton = closed ? 'tool_openpath' : 'tool_closepath';
hidebutton = closed ? 'tool_closepath' : 'tool_openpath'; const hidebutton = closed ? 'tool_closepath' : 'tool_openpath';
$id(hidebutton).style.display = 'none'; $id(hidebutton).style.display = 'none';
$id(showbutton).style.display = 'block'; $id(showbutton).style.display = 'block';
}; };
@@ -48,8 +48,8 @@ export default {
const toggleClosed = function () { const toggleClosed = function () {
const path = selElems[0]; const path = selElems[0];
if (path) { if (path) {
const seglist = path.pathSegList, const seglist = path.pathSegList;
last = seglist.numberOfItems - 1; const last = seglist.numberOfItems - 1;
// is closed // is closed
if (seglist.getItem(last).pathSegType === 1) { if (seglist.getItem(last).pathSegType === 1) {
seglist.removeItem(last); seglist.removeItem(last);

10
src/editor/extensions/ext-connector/ext-connector.js
View File

@@ -30,9 +30,9 @@ export default {
const svgEditor = this; const svgEditor = this;
const { svgCanvas } = svgEditor; const { svgCanvas } = svgEditor;
const { getElem, $id, mergeDeep } = svgCanvas; const { getElem, $id, mergeDeep } = svgCanvas;
const { svgroot } = S, const { svgroot } = S;
addElem = svgCanvas.addSVGElementFromJson, const addElem = svgCanvas.addSVGElementFromJson;
selManager = S.selectorManager; const selManager = S.selectorManager;
await loadExtensionTranslation(svgEditor); await loadExtensionTranslation(svgEditor);
let startX; let startX;
@@ -437,8 +437,8 @@ export default {
const x = opts.mouse_x / zoom; const x = opts.mouse_x / zoom;
const y = opts.mouse_y / zoom; const y = opts.mouse_y / zoom;
const diffX = x - startX, const diffX = x - startX;
diffY = y - startY; const diffY = y - startY;
const mode = svgCanvas.getMode(); const mode = svgCanvas.getMode();

24
src/editor/extensions/ext-eyedropper/ext-eyedropper.js
View File

@@ -30,18 +30,18 @@ export default {
async init(S) { async init(S) {
const svgEditor = this; const svgEditor = this;
await loadExtensionTranslation(svgEditor); await loadExtensionTranslation(svgEditor);
const { ChangeElementCommand } = S, // , svgcontent, const { ChangeElementCommand } = S; // , svgcontent,
// svgdoc = S.svgroot.parentNode.ownerDocument, // svgdoc = S.svgroot.parentNode.ownerDocument,
{ svgCanvas } = svgEditor, const { svgCanvas } = svgEditor;
addToHistory = function (cmd) { svgCanvas.undoMgr.addCommandToHistory(cmd); }, const addToHistory = function (cmd) { svgCanvas.undoMgr.addCommandToHistory(cmd); };
currentStyle = { const currentStyle = {
fillPaint: 'red', fillOpacity: 1.0, fillPaint: 'red', fillOpacity: 1.0,
strokePaint: 'black', strokeOpacity: 1.0, strokePaint: 'black', strokeOpacity: 1.0,
strokeWidth: 5, strokeDashArray: null, strokeWidth: 5, strokeDashArray: null,
opacity: 1.0, opacity: 1.0,
strokeLinecap: 'butt', strokeLinecap: 'butt',
strokeLinejoin: 'miter' strokeLinejoin: 'miter'
}; };
const { $id } = svgCanvas; const { $id } = svgCanvas;
/** /**

8
src/editor/extensions/ext-foreignobject/ext-foreignobject.js
View File

@@ -66,10 +66,10 @@ export default {
$id('foreign_cancel').style.display = (on) ? 'block' : 'none'; $id('foreign_cancel').style.display = (on) ? 'block' : 'none';
} }
let selElems, let selElems;
started, let started;
newFO, let newFO;
editingforeign = false; let editingforeign = false;
/** /**
* This function sets the content of element elt to the input XML. * This function sets the content of element elt to the input XML.

4
src/editor/extensions/ext-imagelib/ext-imagelib.js
View File

@@ -91,7 +91,7 @@ export default {
let mode = 's'; let mode = 's';
let multiArr = []; let multiArr = [];
let transferStopped = false; let transferStopped = false;
let preview, submit; let preview; let submit;
/** /**
* Contains the SVG to insert. * Contains the SVG to insert.
@@ -190,7 +190,7 @@ export default {
} }
} }
let entry, curMeta, svgStr, imgStr; let entry; let curMeta; let svgStr; let imgStr;
switch (type) { switch (type) {
case 'meta': { case 'meta': {
// Metadata // Metadata

2
src/editor/extensions/ext-markers/ext-markers.js
View File

@@ -146,7 +146,7 @@ export default {
if (on) { if (on) {
const el = selElems[0]; const el = selElems[0];
let val, ci; let val; let ci;
$.each(mtypes, function (i, pos) { $.each(mtypes, function (i, pos) {
const m = getLinked(el, 'marker-' + pos); const m = getLinked(el, 'marker-' + pos);
const txtbox = $id(pos + '_marker'); const txtbox = $id(pos + '_marker');

12
src/editor/extensions/ext-mathjax/ext-mathjax.js
View File

@@ -59,10 +59,10 @@ export default {
// Obtained Text-AMS-MML_SVG.js from https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.3/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
{ uiStrings } = svgEditor; { uiStrings } = svgEditor;
let let
math, math;
locationX, let locationX;
locationY, let locationY;
mathjaxLoaded = false; let mathjaxLoaded = false;
// TODO: Implement language support. Move these uiStrings to the locale files and // TODO: Implement language support. Move these uiStrings to the locale files and
// the code to the langReady callback. Also i18nize alert and HTML below // the code to the langReady callback. Also i18nize alert and HTML below
@@ -231,8 +231,8 @@ export default {
return undefined; return undefined;
}, },
callback () { callback () {
const head = document.head || document.getElementsByTagName('head')[0], const head = document.head || document.getElementsByTagName('head')[0];
style = document.createElement('style'); const style = document.createElement('style');
style.textContent = '#mathjax fieldset{' + style.textContent = '#mathjax fieldset{' +
'padding: 5px;' + 'padding: 5px;' +
'margin: 5px;' + 'margin: 5px;' +

4
src/editor/extensions/ext-overview_window/dragmove/dragmove.js
View File

@@ -24,8 +24,8 @@ export const dragmove = function(target, handler, parent, onStart, onEnd, onDrag
} }
_loaded = true; _loaded = true;
let isMoving = false, hasStarted = false; let isMoving = false; let hasStarted = false;
let startX = 0, startY = 0, lastX = 0, lastY = 0; let startX = 0; let startY = 0; let lastX = 0; let lastY = 0;
// On the first click and hold, record the offset of the pointer in relation // On the first click and hold, record the offset of the pointer in relation
// to the point of click inside the element. // to the point of click inside the element.

20
src/editor/extensions/ext-placemark/ext-placemark.js
View File

@@ -27,15 +27,15 @@ export default {
const { $id } = svgCanvas; const { $id } = svgCanvas;
const addElem = svgCanvas.addSVGElementFromJson; const addElem = svgCanvas.addSVGElementFromJson;
let let
selElems, selElems;
// editingitex = false, // editingitex = false,
// svgdoc = S.svgroot.parentNode.ownerDocument, // svgdoc = S.svgroot.parentNode.ownerDocument,
started, let started;
newPM; let newPM;
// edg = 0, // edg = 0,
// newFOG, newFOGParent, newDef, newImageName, newMaskID, // newFOG, newFOGParent, newDef, newImageName, newMaskID,
// undoCommand = 'Not image', // undoCommand = 'Not image',
// modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH; // modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH;
const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang')); const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang'));
const markerTypes = { const markerTypes = {
nomarker: {}, nomarker: {},
@@ -372,7 +372,7 @@ export default {
let font = $id('placemarkFont').value.split(' '); let font = $id('placemarkFont').value.split(' ');
const fontSize = Number.parseInt(font.pop()); const fontSize = Number.parseInt(font.pop());
font = font.join(' '); font = font.join(' ');
const x0 = opts.start_x + 10, y0 = opts.start_y + 10; const x0 = opts.start_x + 10; const y0 = opts.start_y + 10;
let maxlen = 0; let maxlen = 0;
const children = [ { const children = [ {
element: 'line', element: 'line',
@@ -479,8 +479,8 @@ export default {
const elements = newPM.children; const elements = newPM.children;
Array.prototype.forEach.call(elements, function(i, _){ Array.prototype.forEach.call(elements, function(i, _){
const [ , , type, n ] = i.id.split('_'); const [ , , type, n ] = i.id.split('_');
const y0 = y + (fontSize + 6) * n, const y0 = y + (fontSize + 6) * n;
x0 = x + maxlen * fontSize * 0.5 + fontSize; const x0 = x + maxlen * fontSize * 0.5 + fontSize;
const nx = (x + (x0 - x) / 2 < px) ? x0 : x; const nx = (x + (x0 - x) / 2 < px) ? x0 : x;
const ny = (y + ((fontSize + 6) * (lines - 1)) / 2 < py) const ny = (y + ((fontSize + 6) * (lines - 1)) / 2 < py)
? y + (fontSize + 6) * (lines - 1) ? y + (fontSize + 6) * (lines - 1)

4
src/editor/extensions/ext-server_opensave/ext-php_savefile.js
View File

@@ -19,8 +19,8 @@ export default {
const saveSvgAction = './savefile.php'; const saveSvgAction = './savefile.php';
svgEditor.setCustomHandlers({ svgEditor.setCustomHandlers({
save (win, data) { save (win, data) {
const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data, const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data;
filename = getFileNameFromTitle(); const filename = getFileNameFromTitle();
// $.post(saveSvgAction, { output_svg: svg, filename }); // $.post(saveSvgAction, { output_svg: svg, filename });
let postData = { output_svg: svg, filename }; let postData = { output_svg: svg, filename };

16
src/editor/extensions/ext-server_opensave/ext-server_opensave.js
View File

@@ -79,9 +79,9 @@ export default {
return false; return false;
} }
const const
saveSvgAction = './filesave.php', saveSvgAction = './filesave.php';
saveImgAction = './filesave.php'; const saveImgAction = './filesave.php';
// Create upload target (hidden iframe) // Create upload target (hidden iframe)
let cancelled = false; let cancelled = false;
@@ -97,8 +97,8 @@ export default {
svgEditor.setCustomHandlers({ svgEditor.setCustomHandlers({
save (win, data) { save (win, 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 // 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
const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data, const svg = '<?xml version="1.0" encoding="UTF-8"?>\n' + data;
filename = getFileNameFromTitle(); const filename = getFileNameFromTitle();
if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + encode64(svg))) { if (clientDownloadSupport(filename, '.svg', 'data:image/svg+xml;charset=UTF-8;base64,' + encode64(svg))) {
return; return;
@@ -116,8 +116,8 @@ export default {
form.remove(); form.remove();
}, },
exportPDF (win, data) { exportPDF (win, data) {
const filename = getFileNameFromTitle(), const filename = getFileNameFromTitle();
datauri = data.output; const datauri = data.output;
if (clientDownloadSupport(filename, '.pdf', datauri)) { if (clientDownloadSupport(filename, '.pdf', datauri)) {
return; return;
} }
@@ -151,7 +151,7 @@ export default {
const datauri = quality ? c.toDataURL(mimeType, quality) : c.toDataURL(mimeType); const datauri = quality ? c.toDataURL(mimeType, quality) : c.toDataURL(mimeType);
// Check if there are issues // Check if there are issues
let pre, note = ''; let pre; let note = '';
if (issues.length) { if (issues.length) {
pre = '\n \u2022 '; // Bullet pre = '\n \u2022 '; // Bullet
note += ('\n\n' + pre + issues.join(pre)); note += ('\n\n' + pre + issues.join(pre));

12
src/editor/extensions/ext-shapes/ext-shapes.js
View File

@@ -110,9 +110,9 @@ export default {
const x = opts.mouse_x / zoom; const x = opts.mouse_x / zoom;
const y = opts.mouse_y / zoom; const y = opts.mouse_y / zoom;
const tlist = canv.getTransformList(curShape), const tlist = canv.getTransformList(curShape);
box = curShape.getBBox(), const box = curShape.getBBox();
left = box.x, top = box.y; const left = box.x; const top = box.y;
const newbox = { const newbox = {
x: Math.min(startX, x), x: Math.min(startX, x),
@@ -135,9 +135,9 @@ export default {
} }
// update the transform list with translate,scale,translate // update the transform list with translate,scale,translate
const translateOrigin = svgroot.createSVGTransform(), const translateOrigin = svgroot.createSVGTransform();
scale = svgroot.createSVGTransform(), const scale = svgroot.createSVGTransform();
translateBack = svgroot.createSVGTransform(); const translateBack = svgroot.createSVGTransform();
translateOrigin.setTranslate(-(left + tx), -(top + ty)); translateOrigin.setTranslate(-(left + tx), -(top + ty));
if (!evt.shiftKey) { if (!evt.shiftKey) {

8
src/editor/extensions/ext-webappfind/ext-webappfind.js
View File

@@ -24,9 +24,9 @@ export default {
async init () { async init () {
const svgEditor = this; const svgEditor = this;
const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang')); const strings = await loadExtensionTranslation(svgEditor.configObj.pref('lang'));
const saveMessage = 'save', const saveMessage = 'save';
readMessage = 'read', const readMessage = 'read';
excludedMessages = [ readMessage, saveMessage ]; const excludedMessages = [ readMessage, saveMessage ];
let pathID; let pathID;
this.canvas.bind( this.canvas.bind(
@@ -38,7 +38,7 @@ export default {
* @returns {void} * @returns {void}
*/ */
(win, { data, origin }) => { (win, { data, origin }) => {
let type, content; let type; let content;
try { try {
({ type, pathID, content } = data.webappfind); // May throw if data is not an object ({ type, pathID, content } = data.webappfind); // 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 if (origin !== location.origin || // We are only interested in a message sent as though within this URL by our browser add-on

4
src/editor/panels/LayersPanel.js
View File

@@ -350,8 +350,8 @@ class LayersPanel {
*/ */
toggleHighlightLayer(layerNameToHighlight) { toggleHighlightLayer(layerNameToHighlight) {
let i; let i;
const curNames = [], const curNames = [];
numLayers = this.editor.svgCanvas.getCurrentDrawing().getNumLayers(); const numLayers = this.editor.svgCanvas.getCurrentDrawing().getNumLayers();
for (i = 0; i < numLayers; i++) { for (i = 0; i < numLayers; i++) {
curNames[i] = this.editor.svgCanvas.getCurrentDrawing().getLayerName(i); curNames[i] = this.editor.svgCanvas.getCurrentDrawing().getLayerName(i);
} }

4
src/editor/panels/TopPanel.js
View File

@@ -65,7 +65,7 @@ class TopPanel {
* @returns {void} * @returns {void}
*/ */
update() { update() {
let i, len; let i; let len;
if (!isNullish(this.selectedElement)) { if (!isNullish(this.selectedElement)) {
switch (this.selectedElement.tagName) { switch (this.selectedElement.tagName) {
case "use": case "use":
@@ -208,7 +208,7 @@ class TopPanel {
if ([ "line", "circle", "ellipse" ].includes(elname)) { if ([ "line", "circle", "ellipse" ].includes(elname)) {
$id("xy_panel").style.display = 'none'; $id("xy_panel").style.display = 'none';
} else { } else {
let x, y; let x; let y;
// Get BBox vals for g, polyline and path // Get BBox vals for g, polyline and path
if ([ "g", "polyline", "path" ].includes(elname)) { if ([ "g", "polyline", "path" ].includes(elname)) {

4
src/editor/touch.js
View File

@@ -5,8 +5,8 @@
* @returns {void} * @returns {void}
*/ */
function touchHandler (ev) { function touchHandler (ev) {
const { changedTouches } = ev, const { changedTouches } = ev;
first = changedTouches[0]; const first = changedTouches[0];
let type = ''; let type = '';
switch (ev.type) { switch (ev.type) {

40
src/svgcanvas/coords.js
View File

@@ -51,19 +51,19 @@ export const init = function (editorContext) {
* @type {module:path.EditorContext#remapElement} * @type {module:path.EditorContext#remapElement}
*/ */
export const remapElement = function (selected, changes, m) { export const remapElement = function (selected, changes, m) {
const remap = function (x, y) { return transformPoint(x, y, m); }, const remap = function (x, y) { return transformPoint(x, y, m); };
scalew = function (w) { return m.a * w; }, const scalew = function (w) { return m.a * w; };
scaleh = function (h) { return m.d * h; }, const scaleh = function (h) { return m.d * h; };
doSnapping = editorContext_.getGridSnapping() && selected.parentNode.parentNode.localName === 'svg', const doSnapping = editorContext_.getGridSnapping() && selected.parentNode.parentNode.localName === 'svg';
finishUp = function () { const finishUp = function () {
if (doSnapping) { if (doSnapping) {
Object.entries(changes).forEach(([ o, value ]) => { Object.entries(changes).forEach(([ o, value ]) => {
changes[o] = snapToGrid(value); changes[o] = snapToGrid(value);
}); });
} }
assignAttributes(selected, changes, 1000, true); assignAttributes(selected, changes, 1000, true);
}, };
box = getBBox(selected); const box = getBBox(selected);
for (let i = 0; i < 2; i++) { for (let i = 0; i < 2; i++) {
const type = i === 0 ? 'fill' : 'stroke'; const type = i === 0 ? 'fill' : 'stroke';
@@ -98,8 +98,8 @@ export const remapElement = function (selected, changes, m) {
if (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && (m.e !== 0 || m.f !== 0)) { if (m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && (m.e !== 0 || m.f !== 0)) {
// [T][M] = [M][T'] // [T][M] = [M][T']
// therefore [T'] = [M_inv][T][M] // therefore [T'] = [M_inv][T][M]
const existing = transformListToTransform(selected).matrix, const existing = transformListToTransform(selected).matrix;
tNew = matrixMultiply(existing.inverse(), m, existing); const tNew = matrixMultiply(existing.inverse(), m, existing);
changes.x = Number.parseFloat(changes.x) + tNew.e; changes.x = Number.parseFloat(changes.x) + tNew.e;
changes.y = Number.parseFloat(changes.y) + tNew.f; changes.y = Number.parseFloat(changes.y) + tNew.f;
} else { } else {
@@ -153,7 +153,7 @@ export const remapElement = function (selected, changes, m) {
changes.cy = c.y; changes.cy = c.y;
// take the minimum of the new selected box's dimensions for the new circle radius // take the minimum of the new selected box's dimensions for the new circle radius
const tbox = transformBox(box.x, box.y, box.width, box.height, m); const tbox = transformBox(box.x, box.y, box.width, box.height, m);
const w = tbox.tr.x - tbox.tl.x, h = tbox.bl.y - tbox.tl.y; const w = tbox.tr.x - tbox.tl.x; const h = tbox.bl.y - tbox.tl.y;
changes.r = Math.min(w / 2, h / 2); changes.r = Math.min(w / 2, h / 2);
if (changes.r) { changes.r = Math.abs(changes.r); } if (changes.r) { changes.r = Math.abs(changes.r); }
@@ -220,8 +220,8 @@ export const remapElement = function (selected, changes, m) {
} }
len = changes.d.length; len = changes.d.length;
const firstseg = changes.d[0], const firstseg = changes.d[0];
currentpt = remap(firstseg.x, firstseg.y); const currentpt = remap(firstseg.x, firstseg.y);
changes.d[0].x = currentpt.x; changes.d[0].x = currentpt.x;
changes.d[0].y = currentpt.y; changes.d[0].y = currentpt.y;
for (let i = 1; i < len; ++i) { for (let i = 1; i < len; ++i) {
@@ -230,8 +230,8 @@ export const remapElement = function (selected, changes, m) {
// if absolute or first segment, we want to remap x, y, x1, y1, x2, y2 // if absolute or first segment, we want to remap x, y, x1, y1, x2, y2
// if relative, we want to scalew, scaleh // if relative, we want to scalew, scaleh
if (type % 2 === 0) { // absolute if (type % 2 === 0) { // absolute
const thisx = (seg.x !== undefined) ? seg.x : currentpt.x, // for V commands const thisx = (seg.x !== undefined) ? seg.x : currentpt.x; // for V commands
thisy = (seg.y !== undefined) ? seg.y : currentpt.y; // for H commands const thisy = (seg.y !== undefined) ? seg.y : currentpt.y; // for H commands
const pt = remap(thisx, thisy); const pt = remap(thisx, thisy);
const pt1 = remap(seg.x1, seg.y1); const pt1 = remap(seg.x1, seg.y1);
const pt2 = remap(seg.x2, seg.y2); const pt2 = remap(seg.x2, seg.y2);

2
src/svgcanvas/draw.js
View File

@@ -479,7 +479,7 @@ export class Drawing {
this.layer_map = {}; this.layer_map = {};
const numchildren = this.svgElem_.childNodes.length; const numchildren = this.svgElem_.childNodes.length;
// loop through all children of SVG element // loop through all children of SVG element
const orphans = [], layernames = []; const orphans = []; const layernames = [];
let layer = null; let layer = null;
let childgroups = false; let childgroups = false;
for (let i = 0; i < numchildren; ++i) { for (let i = 0; i < numchildren; ++i) {

4
src/svgcanvas/elem-get-set.js
View File

@@ -123,7 +123,7 @@ export const setGroupTitleMethod = function (val) {
*/ */
export const setDocumentTitleMethod = function (newTitle) { export const setDocumentTitleMethod = function (newTitle) {
const childs = elemContext_.getSVGContent().childNodes; const childs = elemContext_.getSVGContent().childNodes;
let docTitle = false, oldTitle = ''; let docTitle = false; let oldTitle = '';
const batchCmd = new BatchCommand('Change Image Title'); const batchCmd = new BatchCommand('Change Image Title');
@@ -174,7 +174,7 @@ export const setResolutionMethod = function (x, y) {
batchCmd = new BatchCommand('Fit Canvas to Content'); batchCmd = new BatchCommand('Fit Canvas to Content');
const visEls = getVisibleElements(); const visEls = getVisibleElements();
elemContext_.getCanvas().addToSelection(visEls); elemContext_.getCanvas().addToSelection(visEls);
const dx = [], dy = []; const dx = []; const dy = [];
visEls.forEach(function(_item, _i){ visEls.forEach(function(_item, _i){
dx.push(bbox.x * -1); dx.push(bbox.x * -1);
dy.push(bbox.y * -1); dy.push(bbox.y * -1);

94
src/svgcanvas/event.js
View File

@@ -41,14 +41,14 @@ export const init = function (eventContext) {
}; };
export const getBsplinePoint = function (t) { export const getBsplinePoint = function (t) {
const spline = { x: 0, y: 0 }, const spline = { x: 0, y: 0 };
p0 = { x: eventContext_.getControllPoint2('x'), y: eventContext_.getControllPoint2('y') }, const p0 = { x: eventContext_.getControllPoint2('x'), y: eventContext_.getControllPoint2('y') };
p1 = { x: eventContext_.getControllPoint1('x'), y: eventContext_.getControllPoint1('y') }, const p1 = { x: eventContext_.getControllPoint1('x'), y: eventContext_.getControllPoint1('y') };
p2 = { x: eventContext_.getStart('x'), y: eventContext_.getStart('y') }, const p2 = { x: eventContext_.getStart('x'), y: eventContext_.getStart('y') };
p3 = { x: eventContext_.getEnd('x'), y: eventContext_.getEnd('y') }, const p3 = { x: eventContext_.getEnd('x'), y: eventContext_.getEnd('y') };
S = 1.0 / 6.0, const S = 1.0 / 6.0;
t2 = t * t, const t2 = t * t;
t3 = t2 * t; const t3 = t2 * t;
const m = [ const m = [
[ -1, 3, -3, 1 ], [ -1, 3, -3, 1 ],
@@ -89,14 +89,14 @@ export const mouseMoveEvent = function (evt) {
if (!eventContext_.getStarted()) { return; } if (!eventContext_.getStarted()) { return; }
if (evt.button === 1 || eventContext_.getCanvas().spaceKey) { return; } if (evt.button === 1 || eventContext_.getCanvas().spaceKey) { return; }
let i, xya, cx, cy, dx, dy, len, angle, box, let i; let xya; let cx; let cy; let dx; let dy; let len; let angle; let box;
selected = selectedElements[0]; let selected = selectedElements[0];
const const
pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm()), pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm());
mouseX = pt.x * currentZoom, const mouseX = pt.x * currentZoom;
mouseY = pt.y * currentZoom, const mouseY = pt.y * currentZoom;
shape = getElem(eventContext_.getId()); const shape = getElem(eventContext_.getId());
let realX = mouseX / currentZoom; let realX = mouseX / currentZoom;
let x = realX; let x = realX;
@@ -171,8 +171,8 @@ export const mouseMoveEvent = function (evt) {
// - if newList contains selected, do nothing // - if newList contains selected, do nothing
// - if newList doesn't contain selected, remove it from selected // - if newList doesn't contain selected, remove it from selected
// - for any newList that was not in selectedElements, add it to selected // - for any newList that was not in selectedElements, add it to selected
const elemsToRemove = selectedElements.slice(), elemsToAdd = [], const elemsToRemove = selectedElements.slice(); const elemsToAdd = [];
newList = eventContext_.getIntersectionList(); const newList = eventContext_.getIntersectionList();
// For every element in the intersection, add if not present in selectedElements. // For every element in the intersection, add if not present in selectedElements.
len = newList.length; len = newList.length;
@@ -205,9 +205,9 @@ export const mouseMoveEvent = function (evt) {
tlist = getTransformList(selected); tlist = getTransformList(selected);
const hasMatrix = hasMatrixTransform(tlist); const hasMatrix = hasMatrixTransform(tlist);
box = hasMatrix ? eventContext_.getInitBbox() : utilsGetBBox(selected); box = hasMatrix ? eventContext_.getInitBbox() : utilsGetBBox(selected);
let left = box.x, let left = box.x;
top = box.y, let top = box.y;
{ width, height } = box; let { width, height } = box;
dx = (x - eventContext_.getStartX()); dx = (x - eventContext_.getStartX());
dy = (y - eventContext_.getStartY()); dy = (y - eventContext_.getStartY());
@@ -221,8 +221,8 @@ export const mouseMoveEvent = function (evt) {
// if rotated, adjust the dx,dy values // if rotated, adjust the dx,dy values
angle = getRotationAngle(selected); angle = getRotationAngle(selected);
if (angle) { if (angle) {
const r = Math.sqrt(dx * dx + dy * dy), const r = Math.sqrt(dx * dx + dy * dy);
theta = Math.atan2(dy, dx) - angle * Math.PI / 180.0; const theta = Math.atan2(dy, dx) - angle * Math.PI / 180.0;
dx = r * Math.cos(theta); dx = r * Math.cos(theta);
dy = r * Math.sin(theta); dy = r * Math.sin(theta);
} }
@@ -237,10 +237,10 @@ export const mouseMoveEvent = function (evt) {
} }
let // ts = null, let // ts = null,
tx = 0, ty = 0, tx = 0; let ty = 0;
sy = height ? (height + dy) / height : 1, let sy = height ? (height + dy) / height : 1;
sx = width ? (width + dx) / width : 1; let sx = width ? (width + dx) / width : 1;
// if we are dragging on the north side, then adjust the scale factor and ty // if we are dragging on the north side, then adjust the scale factor and ty
if (eventContext_.getCurrentResizeMode().includes('n')) { if (eventContext_.getCurrentResizeMode().includes('n')) {
sy = height ? (height - dy) / height : 1; sy = height ? (height - dy) / height : 1;
ty = height; ty = height;
@@ -253,9 +253,9 @@ export const mouseMoveEvent = function (evt) {
} }
// update the transform list with translate,scale,translate // update the transform list with translate,scale,translate
const translateOrigin = eventContext_.getSVGRoot().createSVGTransform(), const translateOrigin = eventContext_.getSVGRoot().createSVGTransform();
scale = eventContext_.getSVGRoot().createSVGTransform(), const scale = eventContext_.getSVGRoot().createSVGTransform();
translateBack = eventContext_.getSVGRoot().createSVGTransform(); const translateBack = eventContext_.getSVGRoot().createSVGTransform();
if (eventContext_.getCurConfig().gridSnapping) { if (eventContext_.getCurConfig().gridSnapping) {
left = snapToGrid(left); left = snapToGrid(left);
@@ -332,9 +332,9 @@ export const mouseMoveEvent = function (evt) {
case 'image': { case 'image': {
const square = (eventContext_.getCurrentMode() === 'square') || evt.shiftKey; const square = (eventContext_.getCurrentMode() === 'square') || evt.shiftKey;
let let
w = Math.abs(x - eventContext_.getStartX()), w = Math.abs(x - eventContext_.getStartX());
h = Math.abs(y - eventContext_.getStartY()); let h = Math.abs(y - eventContext_.getStartY());
let newX, newY; let newX; let newY;
if (square) { if (square) {
w = h = Math.max(w, h); w = h = Math.max(w, h);
newX = eventContext_.getStartX() < x ? eventContext_.getStartX() : eventContext_.getStartX() - w; newX = eventContext_.getStartX() < x ? eventContext_.getStartX() : eventContext_.getStartX() - w;
@@ -440,7 +440,7 @@ export const mouseMoveEvent = function (evt) {
} }
if (evt.shiftKey) { if (evt.shiftKey) {
const { path } = pathModule; const { path } = pathModule;
let x1, y1; let x1; let y1;
if (path) { if (path) {
x1 = path.dragging ? path.dragging[0] : eventContext_.getStartX(); x1 = path.dragging ? path.dragging[0] : eventContext_.getStartX();
y1 = path.dragging ? path.dragging[1] : eventContext_.getStartY(); y1 = path.dragging ? path.dragging[1] : eventContext_.getStartY();
@@ -484,8 +484,8 @@ export const mouseMoveEvent = function (evt) {
box = utilsGetBBox(selected); box = utilsGetBBox(selected);
cx = box.x + box.width / 2; cx = box.x + box.width / 2;
cy = box.y + box.height / 2; cy = box.y + box.height / 2;
const m = getMatrix(selected), const m = getMatrix(selected);
center = transformPoint(cx, cy, m); const center = transformPoint(cx, cy, m);
cx = center.x; cx = center.x;
cy = center.y; cy = center.y;
angle = ((Math.atan2(cy - y, cx - x) * (180 / Math.PI)) - 90) % 360; angle = ((Math.atan2(cy - y, cx - x) * (180 / Math.PI)) - 90) % 360;
@@ -541,11 +541,11 @@ export const mouseUpEvent = function (evt) {
const tempJustSelected = eventContext_.getJustSelected(); const tempJustSelected = eventContext_.getJustSelected();
eventContext_.setJustSelected(null); eventContext_.setJustSelected(null);
if (!eventContext_.getStarted()) { return; } if (!eventContext_.getStarted()) { return; }
const pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm()), const pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm());
mouseX = pt.x * currentZoom, const mouseX = pt.x * currentZoom;
mouseY = pt.y * currentZoom, const mouseY = pt.y * currentZoom;
x = mouseX / currentZoom, const x = mouseX / currentZoom;
y = mouseY / currentZoom; const y = mouseY / currentZoom;
let element = getElem(eventContext_.getId()); let element = getElem(eventContext_.getId());
let keep = false; let keep = false;
@@ -934,9 +934,9 @@ export const mouseDownEvent = function (evt) {
eventContext_.setRootSctm($id('svgcontent').querySelector('g').getScreenCTM().inverse()); eventContext_.setRootSctm($id('svgcontent').querySelector('g').getScreenCTM().inverse());
const pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm()), const pt = transformPoint(evt.pageX, evt.pageY, eventContext_.getrootSctm());
mouseX = pt.x * currentZoom, const mouseX = pt.x * currentZoom;
mouseY = pt.y * currentZoom; const mouseY = pt.y * currentZoom;
evt.preventDefault(); evt.preventDefault();
@@ -945,8 +945,8 @@ export const mouseDownEvent = function (evt) {
eventContext_.setLastClickPoint(pt); eventContext_.setLastClickPoint(pt);
} }
let x = mouseX / currentZoom, let x = mouseX / currentZoom;
y = mouseY / currentZoom; let y = mouseY / currentZoom;
let mouseTarget = eventContext_.getCanvas().getMouseTarget(evt); let mouseTarget = eventContext_.getCanvas().getMouseTarget(evt);
if (mouseTarget.tagName === 'a' && mouseTarget.childNodes.length === 1) { if (mouseTarget.tagName === 'a' && mouseTarget.childNodes.length === 1) {
@@ -1099,8 +1099,8 @@ export const mouseDownEvent = function (evt) {
mouseTarget.style.vectorEffect = 'non-scaling-stroke'; mouseTarget.style.vectorEffect = 'non-scaling-stroke';
if (iswebkit) { delayedStroke(mouseTarget); } if (iswebkit) { delayedStroke(mouseTarget); }
const all = mouseTarget.getElementsByTagName('*'), const all = mouseTarget.getElementsByTagName('*');
len = all.length; const len = all.length;
for (let i = 0; i < len; i++) { for (let i = 0; i < len; i++) {
if (!all[i].style) { // mathML if (!all[i].style) { // mathML
continue; continue;
@@ -1344,7 +1344,7 @@ export const DOMMouseScrollEvent = function (e) {
let factor = Math.max(3 / 4, Math.min(4 / 3, (delta))); let factor = Math.max(3 / 4, Math.min(4 / 3, (delta)));
let wZoom, hZoom; let wZoom; let hZoom;
if (factor > 1) { if (factor > 1) {
wZoom = Math.ceil(editorW / workareaViewW * factor * 100) / 100; wZoom = Math.ceil(editorW / workareaViewW * factor * 100) / 100;
hZoom = Math.ceil(editorH / workareaViewH * factor * 100) / 100; hZoom = Math.ceil(editorH / workareaViewH * factor * 100) / 100;

6
src/svgcanvas/history.js
View File

@@ -377,8 +377,8 @@ export class ChangeElementCommand extends Command {
const angle = getRotationAngle(this.elem); const angle = getRotationAngle(this.elem);
if (angle) { if (angle) {
const bbox = this.elem.getBBox(); const bbox = this.elem.getBBox();
const cx = bbox.x + bbox.width / 2, const cx = bbox.x + bbox.width / 2;
cy = bbox.y + bbox.height / 2; const cy = bbox.y + bbox.height / 2;
const rotate = [ 'rotate(', angle, ' ', cx, ',', cy, ')' ].join(''); const rotate = [ 'rotate(', angle, ' ', cx, ',', cy, ')' ].join('');
if (rotate !== this.elem.getAttribute('transform')) { if (rotate !== this.elem.getAttribute('transform')) {
this.elem.setAttribute('transform', rotate); this.elem.setAttribute('transform', rotate);
@@ -585,7 +585,7 @@ export class UndoManager {
beginUndoableChange (attrName, elems) { beginUndoableChange (attrName, elems) {
const p = ++this.undoChangeStackPointer; const p = ++this.undoChangeStackPointer;
let i = elems.length; let i = elems.length;
const oldValues = new Array(i), elements = new Array(i); const oldValues = new Array(i); const elements = new Array(i);
while (i--) { while (i--) {
const elem = elems[i]; const elem = elems[i];
if (isNullish(elem)) { continue; } if (isNullish(elem)) { continue; }

4
src/svgcanvas/jQuery.attr.js
View File

@@ -19,8 +19,8 @@
* @returns {external:jQuery} * @returns {external:jQuery}
*/ */
export default function jQueryPluginSVG ($) { export default function jQueryPluginSVG ($) {
const proxied = $.fn.attr, const proxied = $.fn.attr;
svgns = 'http://www.w3.org/2000/svg'; const svgns = 'http://www.w3.org/2000/svg';
/** /**
* @typedef {PlainObject<string, string|Float>} module:jQueryAttr.Attributes * @typedef {PlainObject<string, string|Float>} module:jQueryAttr.Attributes
*/ */

16
src/svgcanvas/math.js
View File

@@ -114,15 +114,15 @@ export const hasMatrixTransform = function (tlist) {
* @returns {module:math.TransformedBox} * @returns {module:math.TransformedBox}
*/ */
export const transformBox = function (l, t, w, h, m) { export const transformBox = function (l, t, w, h, m) {
const tl = transformPoint(l, t, m), const tl = transformPoint(l, t, m);
tr = transformPoint((l + w), t, m), const tr = transformPoint((l + w), t, m);
bl = transformPoint(l, (t + h), m), const bl = transformPoint(l, (t + h), m);
br = transformPoint((l + w), (t + h), m), const br = transformPoint((l + w), (t + h), m);
minx = Math.min(tl.x, tr.x, bl.x, br.x), const minx = Math.min(tl.x, tr.x, bl.x, br.x);
maxx = Math.max(tl.x, tr.x, bl.x, br.x), const maxx = Math.max(tl.x, tr.x, bl.x, br.x);
miny = Math.min(tl.y, tr.y, bl.y, br.y), const miny = Math.min(tl.y, tr.y, bl.y, br.y);
maxy = Math.max(tl.y, tr.y, bl.y, br.y); const maxy = Math.max(tl.y, tr.y, bl.y, br.y);
return { return {
tl, tl,

10
src/svgcanvas/paste-elem.js
View File

@@ -97,7 +97,7 @@ export const pasteElementsMethod = function (type, x, y) {
pasteContext_.getCanvas().selectOnly(pasted); pasteContext_.getCanvas().selectOnly(pasted);
if (type !== 'in_place') { if (type !== 'in_place') {
let ctrX, ctrY; let ctrX; let ctrY;
if (!type) { if (!type) {
ctrX = pasteContext_.getLastClickPoint('x'); ctrX = pasteContext_.getLastClickPoint('x');
@@ -108,10 +108,10 @@ export const pasteElementsMethod = function (type, x, y) {
} }
const bbox = getStrokedBBoxDefaultVisible(pasted); const bbox = getStrokedBBoxDefaultVisible(pasted);
const cx = ctrX - (bbox.x + bbox.width / 2), const cx = ctrX - (bbox.x + bbox.width / 2);
cy = ctrY - (bbox.y + bbox.height / 2), const cy = ctrY - (bbox.y + bbox.height / 2);
dx = [], const dx = [];
dy = []; const dy = [];
pasted.forEach(function(_item){ pasted.forEach(function(_item){
dx.push(cx); dx.push(cx);

32
src/svgcanvas/path-actions.js
View File

@@ -48,19 +48,19 @@ export const init = function (pathActionsContext) {
export const convertPath = function (pth, toRel) { export const convertPath = function (pth, toRel) {
const { pathSegList } = pth; const { pathSegList } = pth;
const len = pathSegList.numberOfItems; const len = pathSegList.numberOfItems;
let curx = 0, cury = 0; let curx = 0; let cury = 0;
let d = ''; let d = '';
let lastM = null; let lastM = null;
for (let i = 0; i < len; ++i) { for (let i = 0; i < len; ++i) {
const seg = pathSegList.getItem(i); const seg = pathSegList.getItem(i);
// if these properties are not in the segment, set them to zero // if these properties are not in the segment, set them to zero
let x = seg.x || 0, let x = seg.x || 0;
y = seg.y || 0, let y = seg.y || 0;
x1 = seg.x1 || 0, let x1 = seg.x1 || 0;
y1 = seg.y1 || 0, let y1 = seg.y1 || 0;
x2 = seg.x2 || 0, let x2 = seg.x2 || 0;
y2 = seg.y2 || 0; let y2 = seg.y2 || 0;
const type = seg.pathSegType; const type = seg.pathSegType;
const pathMap = pathActionsContext_.getPathMap(); const pathMap = pathActionsContext_.getPathMap();
@@ -232,7 +232,7 @@ function pathDSegment (letter, points, morePoints, lastPoint) {
*/ */
export const pathActionsMethod = (function () { export const pathActionsMethod = (function () {
let subpath = false; let subpath = false;
let newPoint, firstCtrl; let newPoint; let firstCtrl;
let currentPath = null; let currentPath = null;
let hasMoved = false; let hasMoved = false;
@@ -265,7 +265,7 @@ export const pathActionsMethod = (function () {
// - https://www.codeproject.com/KB/graphics/BezierSpline.aspx?msg=2956963 // - https://www.codeproject.com/KB/graphics/BezierSpline.aspx?msg=2956963
// - https://www.ian-ko.com/ET_GeoWizards/UserGuide/smooth.htm // - https://www.ian-ko.com/ET_GeoWizards/UserGuide/smooth.htm
// - https://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/bezier-der.html // - https://www.cs.mtu.edu/~shene/COURSES/cs3621/NOTES/spline/Bezier/bezier-der.html
let curpos = points.getItem(0), prevCtlPt = null; let curpos = points.getItem(0); let prevCtlPt = null;
let d = []; let d = [];
d.push([ 'M', curpos.x, ',', curpos.y, ' C' ].join('')); d.push([ 'M', curpos.x, ',', curpos.y, ' C' ].join(''));
for (i = 1; i <= (N - 4); i += 3) { for (i = 1; i <= (N - 4); i += 3) {
@@ -332,9 +332,9 @@ export const pathActionsMethod = (function () {
let mouseY = startY; // Was this meant to work with the other `mouseY`? (was defined globally so adding `let` to at least avoid a global) let mouseY = startY; // Was this meant to work with the other `mouseY`? (was defined globally so adding `let` to at least avoid a global)
const currentZoom = editorContext_.getCurrentZoom(); const currentZoom = editorContext_.getCurrentZoom();
let x = mouseX / currentZoom, let x = mouseX / currentZoom;
y = mouseY / currentZoom, let y = mouseY / currentZoom;
stretchy = getElem('path_stretch_line'); let stretchy = getElem('path_stretch_line');
newPoint = [ x, y ]; newPoint = [ x, y ];
if (editorContext_.getGridSnapping()) { if (editorContext_.getGridSnapping()) {
@@ -384,7 +384,7 @@ export const pathActionsMethod = (function () {
while (i) { while (i) {
i--; i--;
const item = seglist.getItem(i); const item = seglist.getItem(i);
const px = item.x, py = item.y; const px = item.x; const py = item.y;
// found a matching point // found a matching point
if (x >= (px - FUZZ) && x <= (px + FUZZ) && if (x >= (px - FUZZ) && x <= (px + FUZZ) &&
y >= (py - FUZZ) && y <= (py + FUZZ) y >= (py - FUZZ) && y <= (py + FUZZ)
@@ -464,7 +464,7 @@ export const pathActionsMethod = (function () {
const num = drawnPath.pathSegList.numberOfItems; const num = drawnPath.pathSegList.numberOfItems;
const last = drawnPath.pathSegList.getItem(num - 1); const last = drawnPath.pathSegList.getItem(num - 1);
const lastx = last.x, lasty = last.y; const lastx = last.x; const lasty = last.y;
if (evt.shiftKey) { if (evt.shiftKey) {
const xya = snapToAngle(lastx, lasty, x, y); const xya = snapToAngle(lastx, lasty, x, y);
@@ -904,7 +904,7 @@ export const pathActionsMethod = (function () {
if (type === 1) { continue; } if (type === 1) { continue; }
const pts = []; const pts = [];
[ '', 1, 2 ].forEach(function(n){ [ '', 1, 2 ].forEach(function(n){
const x = seg['x' + n], y = seg['y' + n]; const x = seg['x' + n]; const y = seg['y' + n];
if (x !== undefined && y !== undefined) { if (x !== undefined && y !== undefined) {
const pt = transformPoint(x, y, m); const pt = transformPoint(x, y, m);
pts.splice(pts.length, 0, pt.x, pt.y); pts.splice(pts.length, 0, pt.x, pt.y);
@@ -1050,7 +1050,7 @@ export const pathActionsMethod = (function () {
return; return;
} }
let lastM, zSeg; let lastM; let zSeg;
// Find this sub-path's closing point and remove // Find this sub-path's closing point and remove
for (let i = 0; i < list.numberOfItems; i++) { for (let i = 0; i < list.numberOfItems; i++) {

4
src/svgcanvas/path-method.js
View File

@@ -544,7 +544,7 @@ export class Segment {
* @returns {void} * @returns {void}
*/ */
setLinked (num) { setLinked (num) {
let seg, anum, pt; let seg; let anum; let pt;
if (num === 2) { if (num === 2) {
anum = 1; anum = 1;
seg = this.next; seg = this.next;
@@ -744,7 +744,7 @@ export class Path {
if (!seg.prev) { return; } if (!seg.prev) { return; }
const { prev } = seg; const { prev } = seg;
let newseg, newX, newY; let newseg; let newX; let newY;
switch (seg.item.pathSegType) { switch (seg.item.pathSegType) {
case 4: { case 4: {
newX = (seg.item.x + prev.item.x) / 2; newX = (seg.item.x + prev.item.x) / 2;

62
src/svgcanvas/path.js
View File

@@ -382,26 +382,26 @@ export const getSegSelector = getSegSelectorMethod;
*/ */
export const smoothControlPoints = function (ct1, ct2, pt) { export const smoothControlPoints = function (ct1, ct2, pt) {
// each point must not be the origin // each point must not be the origin
const x1 = ct1.x - pt.x, const x1 = ct1.x - pt.x;
y1 = ct1.y - pt.y, const y1 = ct1.y - pt.y;
x2 = ct2.x - pt.x, const x2 = ct2.x - pt.x;
y2 = ct2.y - pt.y; const y2 = ct2.y - pt.y;
if ((x1 !== 0 || y1 !== 0) && (x2 !== 0 || y2 !== 0)) { if ((x1 !== 0 || y1 !== 0) && (x2 !== 0 || y2 !== 0)) {
const const
r1 = Math.sqrt(x1 * x1 + y1 * y1), r1 = Math.sqrt(x1 * x1 + y1 * y1);
r2 = Math.sqrt(x2 * x2 + y2 * y2), const r2 = Math.sqrt(x2 * x2 + y2 * y2);
nct1 = editorContext_.getSVGRoot().createSVGPoint(), const nct1 = editorContext_.getSVGRoot().createSVGPoint();
nct2 = editorContext_.getSVGRoot().createSVGPoint(); const nct2 = editorContext_.getSVGRoot().createSVGPoint();
let anglea = Math.atan2(y1, x1), let anglea = Math.atan2(y1, x1);
angleb = Math.atan2(y2, x2); let angleb = Math.atan2(y2, x2);
if (anglea < 0) { anglea += 2 * Math.PI; } if (anglea < 0) { anglea += 2 * Math.PI; }
if (angleb < 0) { angleb += 2 * Math.PI; } if (angleb < 0) { angleb += 2 * Math.PI; }
const angleBetween = Math.abs(anglea - angleb), const angleBetween = Math.abs(anglea - angleb);
angleDiff = Math.abs(Math.PI - angleBetween) / 2; const angleDiff = Math.abs(Math.PI - angleBetween) / 2;
let newAnglea, newAngleb; let newAnglea; let newAngleb;
if (anglea - angleb > 0) { if (anglea - angleb > 0) {
newAnglea = angleBetween < Math.PI ? (anglea + angleDiff) : (anglea - angleDiff); newAnglea = angleBetween < Math.PI ? (anglea + angleDiff) : (anglea - angleDiff);
newAngleb = angleBetween < Math.PI ? (angleb - angleDiff) : (angleb + angleDiff); newAngleb = angleBetween < Math.PI ? (angleb - angleDiff) : (angleb + angleDiff);
@@ -443,7 +443,7 @@ export const removePath_ = function (id) {
if (id in pathData) { delete pathData[id]; } if (id in pathData) { delete pathData[id]; }
}; };
let newcx, newcy, oldcx, oldcy, angle; let newcx; let newcy; let oldcx; let oldcy; let angle;
const getRotVals = function (x, y) { const getRotVals = function (x, y) {
let dx = x - oldcx; let dx = x - oldcx;
@@ -493,10 +493,10 @@ export const recalcRotatedPath = function () {
newcy = box.y + box.height / 2; newcy = box.y + box.height / 2;
// un-rotate the new center to the proper position // un-rotate the new center to the proper position
const dx = newcx - oldcx, const dx = newcx - oldcx;
dy = newcy - oldcy, const dy = newcy - oldcy;
r = Math.sqrt(dx * dx + dy * dy), const r = Math.sqrt(dx * dx + dy * dy);
theta = Math.atan2(dy, dx) + angle; const theta = Math.atan2(dy, dx) + angle;
newcx = r * Math.cos(theta) + oldcx; newcx = r * Math.cos(theta) + oldcx;
newcy = r * Math.sin(theta) + oldcy; newcy = r * Math.sin(theta) + oldcy;
@@ -506,12 +506,12 @@ export const recalcRotatedPath = function () {
let i = list.numberOfItems; let i = list.numberOfItems;
while (i) { while (i) {
i -= 1; i -= 1;
const seg = list.getItem(i), const seg = list.getItem(i);
type = seg.pathSegType; const type = seg.pathSegType;
if (type === 1) { continue; } if (type === 1) { continue; }
const rvals = getRotVals(seg.x, seg.y), const rvals = getRotVals(seg.x, seg.y);
points = [ rvals.x, rvals.y ]; const points = [ rvals.x, rvals.y ];
if (!isNullish(seg.x1) && !isNullish(seg.x2)) { if (!isNullish(seg.x1) && !isNullish(seg.x2)) {
const cVals1 = getRotVals(seg.x1, seg.y1); const cVals1 = getRotVals(seg.x1, seg.y1);
const cVals2 = getRotVals(seg.x2, seg.y2); const cVals2 = getRotVals(seg.x2, seg.y2);
@@ -525,8 +525,8 @@ export const recalcRotatedPath = function () {
// selectedBBoxes[0].width = box.width; selectedBBoxes[0].height = box.height; // selectedBBoxes[0].width = box.width; selectedBBoxes[0].height = box.height;
// now we must set the new transform to be rotated around the new center // now we must set the new transform to be rotated around the new center
const Rnc = editorContext_.getSVGRoot().createSVGTransform(), const Rnc = editorContext_.getSVGRoot().createSVGTransform();
tlist = getTransformList(currentPath); const tlist = getTransformList(currentPath);
Rnc.setRotate((angle * 180.0 / Math.PI), newcx, newcy); Rnc.setRotate((angle * 180.0 / Math.PI), newcx, newcy);
tlist.replaceItem(Rnc, 0); tlist.replaceItem(Rnc, 0);
}; };
@@ -613,19 +613,19 @@ const pathMap = [
export const convertPath = function (pth, toRel) { export const convertPath = function (pth, toRel) {
const { pathSegList } = pth; const { pathSegList } = pth;
const len = pathSegList.numberOfItems; const len = pathSegList.numberOfItems;
let curx = 0, cury = 0; let curx = 0; let cury = 0;
let d = ''; let d = '';
let lastM = null; let lastM = null;
for (let i = 0; i < len; ++i) { for (let i = 0; i < len; ++i) {
const seg = pathSegList.getItem(i); const seg = pathSegList.getItem(i);
// if these properties are not in the segment, set them to zero // if these properties are not in the segment, set them to zero
let x = seg.x || 0, let x = seg.x || 0;
y = seg.y || 0, let y = seg.y || 0;
x1 = seg.x1 || 0, let x1 = seg.x1 || 0;
y1 = seg.y1 || 0, let y1 = seg.y1 || 0;
x2 = seg.x2 || 0, let x2 = seg.x2 || 0;
y2 = seg.y2 || 0; let y2 = seg.y2 || 0;
const type = seg.pathSegType; const type = seg.pathSegType;
let letter = pathMap[type][toRel ? 'toLowerCase' : 'toUpperCase'](); let letter = pathMap[type][toRel ? 'toLowerCase' : 'toUpperCase']();

32
src/svgcanvas/recalculate.js
View File

@@ -249,7 +249,7 @@ export const recalculateDimensions = function (selected) {
// save the start transform value too // save the start transform value too
initial.transform = context_.getStartTransform() || ''; initial.transform = context_.getStartTransform() || '';
let oldcenter, newcenter; let oldcenter; let newcenter;
// if it's a regular group, we have special processing to flatten transforms // if it's a regular group, we have special processing to flatten transforms
if ((selected.tagName === 'g' && !gsvg) || selected.tagName === 'a') { if ((selected.tagName === 'g' && !gsvg) || selected.tagName === 'a') {
@@ -281,7 +281,7 @@ export const recalculateDimensions = function (selected) {
} }
} }
const N = tlist.numberOfItems; const N = tlist.numberOfItems;
let tx = 0, ty = 0, operation = 0; let tx = 0; let ty = 0; let operation = 0;
let firstM; let firstM;
if (N) { if (N) {
@@ -296,9 +296,9 @@ export const recalculateDimensions = function (selected) {
// if the children are unrotated, pass the scale down directly // if the children are unrotated, pass the scale down directly
// otherwise pass the equivalent matrix() down directly // otherwise pass the equivalent matrix() down directly
const tm = tlist.getItem(N - 3).matrix, const tm = tlist.getItem(N - 3).matrix;
sm = tlist.getItem(N - 2).matrix, const sm = tlist.getItem(N - 2).matrix;
tmn = tlist.getItem(N - 1).matrix; const tmn = tlist.getItem(N - 1).matrix;
const children = selected.childNodes; const children = selected.childNodes;
let c = children.length; let c = children.length;
@@ -360,9 +360,9 @@ export const recalculateDimensions = function (selected) {
// [S2] = [T2_inv][M_inv][T][S][-T][M][-T2_inv] // [S2] = [T2_inv][M_inv][T][S][-T][M][-T2_inv]
const s2 = matrixMultiply(t2.inverse(), m.inverse(), tm, sm, tmn, m, t2n.inverse()); const s2 = matrixMultiply(t2.inverse(), m.inverse(), tm, sm, tmn, m, t2n.inverse());
const translateOrigin = svgroot.createSVGTransform(), const translateOrigin = svgroot.createSVGTransform();
scale = svgroot.createSVGTransform(), const scale = svgroot.createSVGTransform();
translateBack = svgroot.createSVGTransform(); const translateBack = svgroot.createSVGTransform();
translateOrigin.setTranslate(t2n.e, t2n.f); translateOrigin.setTranslate(t2n.e, t2n.f);
scale.setScale(s2.a, s2.d); scale.setScale(s2.a, s2.d);
translateBack.setTranslate(t2.e, t2.f); translateBack.setTranslate(t2.e, t2.f);
@@ -477,8 +477,8 @@ export const recalculateDimensions = function (selected) {
// keep pushing it down to the children // keep pushing it down to the children
} else if (N === 1 && tlist.getItem(0).type === 1 && !gangle) { } else if (N === 1 && tlist.getItem(0).type === 1 && !gangle) {
operation = 1; operation = 1;
const m = tlist.getItem(0).matrix, const m = tlist.getItem(0).matrix;
children = selected.childNodes; const children = selected.childNodes;
let c = children.length; let c = children.length;
while (c--) { while (c--) {
const child = children.item(c); const child = children.item(c);
@@ -549,9 +549,9 @@ export const recalculateDimensions = function (selected) {
const rold = roldt.matrix; const rold = roldt.matrix;
const rnew = svgroot.createSVGTransform(); const rnew = svgroot.createSVGTransform();
rnew.setRotate(gangle, newcenter.x, newcenter.y); rnew.setRotate(gangle, newcenter.x, newcenter.y);
const rnewInv = rnew.matrix.inverse(), const rnewInv = rnew.matrix.inverse();
mInv = m.inverse(), const mInv = m.inverse();
extrat = matrixMultiply(mInv, rnewInv, rold, m); const extrat = matrixMultiply(mInv, rnewInv, rold, m);
tx = extrat.e; tx = extrat.e;
ty = extrat.f; ty = extrat.f;
@@ -691,9 +691,9 @@ export const recalculateDimensions = function (selected) {
} else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) && } else if ((N === 1 || (N > 1 && tlist.getItem(1).type !== 3)) &&
tlist.getItem(0).type === 2) { tlist.getItem(0).type === 2) {
operation = 2; // translate operation = 2; // translate
const oldxlate = tlist.getItem(0).matrix, const oldxlate = tlist.getItem(0).matrix;
meq = transformListToTransform(tlist, 1).matrix, const meq = transformListToTransform(tlist, 1).matrix;
meqInv = meq.inverse(); const meqInv = meq.inverse();
m = matrixMultiply(meqInv, oldxlate, meq); m = matrixMultiply(meqInv, oldxlate, meq);
tlist.removeItem(0); tlist.removeItem(0);
// else if this child now has a matrix imposition (from a parent group) // else if this child now has a matrix imposition (from a parent group)

42
src/svgcanvas/select.js
View File

@@ -107,12 +107,12 @@ export class Selector {
*/ */
resize(bbox) { resize(bbox) {
const dataStorage = svgFactory_.getDataStorage(); const dataStorage = svgFactory_.getDataStorage();
const selectedBox = this.selectorRect, const selectedBox = this.selectorRect;
mgr = selectorManager_, const mgr = selectorManager_;
selectedGrips = mgr.selectorGrips, const selectedGrips = mgr.selectorGrips;
selected = this.selectedElement, const selected = this.selectedElement;
sw = selected.getAttribute('stroke-width'), const sw = selected.getAttribute('stroke-width');
currentZoom = svgFactory_.getCurrentZoom(); const currentZoom = svgFactory_.getCurrentZoom();
let offset = 1 / currentZoom; let offset = 1 / currentZoom;
if (selected.getAttribute('stroke') !== 'none' && !isNaN(sw)) { if (selected.getAttribute('stroke') !== 'none' && !isNaN(sw)) {
offset += (sw / 2); offset += (sw / 2);
@@ -147,7 +147,7 @@ export class Selector {
} }
// apply the transforms // apply the transforms
const l = bbox.x, t = bbox.y, w = bbox.width, h = bbox.height; const l = bbox.x; const t = bbox.y; const w = bbox.width; const h = bbox.height;
// bbox = {x: l, y: t, width: w, height: h}; // Not in use // bbox = {x: l, y: t, width: w, height: h}; // Not in use
// we need to handle temporary transforms too // we need to handle temporary transforms too
@@ -156,16 +156,16 @@ export class Selector {
// * // *
offset *= currentZoom; offset *= currentZoom;
const nbox = transformBox(l * currentZoom, t * currentZoom, w * currentZoom, h * currentZoom, m), const nbox = transformBox(l * currentZoom, t * currentZoom, w * currentZoom, h * currentZoom, m);
{ aabox } = nbox; const { aabox } = nbox;
let nbax = aabox.x - offset, let nbax = aabox.x - offset;
nbay = aabox.y - offset, let nbay = aabox.y - offset;
nbaw = aabox.width + (offset * 2), let nbaw = aabox.width + (offset * 2);
nbah = aabox.height + (offset * 2); let nbah = aabox.height + (offset * 2);
// now if the shape is rotated, un-rotate it // now if the shape is rotated, un-rotate it
const cx = nbax + nbaw / 2, const cx = nbax + nbaw / 2;
cy = nbay + nbah / 2; const cy = nbay + nbah / 2;
const angle = getRotationAngle(selected); const angle = getRotationAngle(selected);
if (angle) { if (angle) {
@@ -179,10 +179,10 @@ export class Selector {
// calculate the axis-aligned bbox // calculate the axis-aligned bbox
const { tl } = nbox; const { tl } = nbox;
let minx = tl.x, let minx = tl.x;
miny = tl.y, let miny = tl.y;
maxx = tl.x, let maxx = tl.x;
maxy = tl.y; let maxy = tl.y;
const { min, max } = Math; const { min, max } = Math;
@@ -447,8 +447,8 @@ export class SelectorManager {
*/ */
releaseSelector(elem) { releaseSelector(elem) {
if (isNullish(elem)) { return; } if (isNullish(elem)) { return; }
const N = this.selectors.length, const N = this.selectors.length;
sel = this.selectorMap[elem.id]; const sel = this.selectorMap[elem.id];
if (sel && !sel.locked) { if (sel && !sel.locked) {
// TODO(codedread): Ensure this exists in this module. // TODO(codedread): Ensure this exists in this module.
console.warn('WARNING! selector was released but was already unlocked'); console.warn('WARNING! selector was released but was already unlocked');

16
src/svgcanvas/selected-elem.js
View File

@@ -112,7 +112,7 @@ export const moveUpDownSelected = function (dir) {
elementContext_.setCurBBoxes([]); elementContext_.setCurBBoxes([]);
// curBBoxes = []; // curBBoxes = [];
let closest, foundCur; let closest; let foundCur;
// jQuery sorts this list // jQuery sorts this list
const list = elementContext_.getIntersectionList(getStrokedBBoxDefaultVisible([ selected ])); const list = elementContext_.getIntersectionList(getStrokedBBoxDefaultVisible([ selected ]));
if (dir === 'Down') { list.reverse(); } if (dir === 'Down') { list.reverse(); }
@@ -230,7 +230,7 @@ export const moveSelectedElements = function (dx, dy, undoable) {
export const cloneSelectedElements = function (x, y) { export const cloneSelectedElements = function (x, y) {
const selectedElements = elementContext_.getSelectedElements(); const selectedElements = elementContext_.getSelectedElements();
const currentGroup = elementContext_.getCurrentGroup(); const currentGroup = elementContext_.getCurrentGroup();
let i, elem; let i; let elem;
const batchCmd = new BatchCommand('Clone Elements'); const batchCmd = new BatchCommand('Clone Elements');
// find all the elements selected (stop at first null) // find all the elements selected (stop at first null)
const len = selectedElements.length; const len = selectedElements.length;
@@ -290,9 +290,9 @@ export const alignSelectedElements = function (type, relativeTo) {
const bboxes = []; // angles = []; const bboxes = []; // angles = [];
const len = selectedElements.length; const len = selectedElements.length;
if (!len) { return; } if (!len) { return; }
let minx = Number.MAX_VALUE, maxx = Number.MIN_VALUE, let minx = Number.MAX_VALUE; let maxx = Number.MIN_VALUE;
miny = Number.MAX_VALUE, maxy = Number.MIN_VALUE; let miny = Number.MAX_VALUE; let maxy = Number.MIN_VALUE;
let curwidth = Number.MIN_VALUE, curheight = Number.MIN_VALUE; let curwidth = Number.MIN_VALUE; let curheight = Number.MIN_VALUE;
for (let i = 0; i < len; ++i) { for (let i = 0; i < len; ++i) {
if (isNullish(selectedElements[i])) { break; } if (isNullish(selectedElements[i])) { break; }
const elem = selectedElements[i]; const elem = selectedElements[i];
@@ -537,7 +537,7 @@ export const pushGroupProperty = function (g, undoable) {
filter: g.getAttribute('filter'), filter: g.getAttribute('filter'),
opacity: g.getAttribute('opacity'), opacity: g.getAttribute('opacity'),
}; };
let gfilter, gblur, changes; let gfilter; let gblur; let changes;
const drawing = elementContext_.getDrawing(); const drawing = elementContext_.getDrawing();
for (let i = 0; i < len; i++) { for (let i = 0; i < len; i++) {
@@ -672,8 +672,8 @@ export const pushGroupProperty = function (g, undoable) {
// [ gm ] [ chm ] = [ chm ] [ gm' ] // [ gm ] [ chm ] = [ chm ] [ gm' ]
// [ gm' ] = [ chmInv ] [ gm ] [ chm ] // [ gm' ] = [ chmInv ] [ gm ] [ chm ]
const chm = transformListToTransform(chtlist).matrix, const chm = transformListToTransform(chtlist).matrix;
chmInv = chm.inverse(); const chmInv = chm.inverse();
const gm = matrixMultiply(chmInv, m, chm); const gm = matrixMultiply(chmInv, m, chm);
newxform.setMatrix(gm); newxform.setMatrix(gm);
chtlist.appendItem(newxform); chtlist.appendItem(newxform);

2
src/svgcanvas/selection.js
View File

@@ -351,7 +351,7 @@ export const setRotationAngle = function (val, preventUndo) {
const elem = selectedElements[0]; const elem = selectedElements[0];
const oldTransform = elem.getAttribute('transform'); const oldTransform = elem.getAttribute('transform');
const bbox = utilsGetBBox(elem); const bbox = utilsGetBBox(elem);
const cx = bbox.x + bbox.width / 2, cy = bbox.y + bbox.height / 2; const cx = bbox.x + bbox.width / 2; const cy = bbox.y + bbox.height / 2;
const tlist = getTransformList(elem); const tlist = getTransformList(elem);
// only remove the real rotational transform if present (i.e. at index=0) // only remove the real rotational transform if present (i.e. at index=0)

18
src/svgcanvas/svg-exec.js
View File

@@ -501,7 +501,7 @@ export const setSvgString = function (xmlString, preventUndo) {
*/ */
export const importSvgString = function (xmlString) { export const importSvgString = function (xmlString) {
const dataStorage = svgContext_.getDataStorage(); const dataStorage = svgContext_.getDataStorage();
let j, ts, useEl; let j; let ts; let useEl;
try { try {
// Get unique ID // Get unique ID
const uid = encode64(xmlString.length + xmlString).substr(0, 32); const uid = encode64(xmlString.length + xmlString).substr(0, 32);
@@ -534,11 +534,11 @@ export const importSvgString = function (xmlString) {
svgContext_.getCanvas().uniquifyElems(svg); svgContext_.getCanvas().uniquifyElems(svg);
const innerw = convertToNum('width', svg.getAttribute('width')), const innerw = convertToNum('width', svg.getAttribute('width'));
innerh = convertToNum('height', svg.getAttribute('height')), const innerh = convertToNum('height', svg.getAttribute('height'));
innervb = svg.getAttribute('viewBox'), const innervb = svg.getAttribute('viewBox');
// if no explicit viewbox, create one out of the width and height // if no explicit viewbox, create one out of the width and height
vb = innervb ? innervb.split(' ') : [ 0, 0, innerw, innerh ]; const vb = innervb ? innervb.split(' ') : [ 0, 0, innerw, innerh ];
for (j = 0; j < 4; ++j) { for (j = 0; j < 4; ++j) {
vb[j] = Number(vb[j]); vb[j] = Number(vb[j]);
} }
@@ -908,8 +908,8 @@ export const uniquifyElemsMethod = function (g) {
const attrnode = n.getAttributeNode(attr); const attrnode = n.getAttributeNode(attr);
if (attrnode) { if (attrnode) {
// the incoming file has been sanitized, so we should be able to safely just strip off the leading # // the incoming file has been sanitized, so we should be able to safely just strip off the leading #
const url = svgContext_.getCanvas().getUrlFromAttr(attrnode.value), const url = svgContext_.getCanvas().getUrlFromAttr(attrnode.value);
refid = url ? url.substr(1) : null; const refid = url ? url.substr(1) : null;
if (refid) { if (refid) {
if (!(refid in ids)) { if (!(refid in ids)) {
// add this id to our map // add this id to our map
@@ -1012,7 +1012,7 @@ export const removeUnusedDefElemsMethod = function () {
const allEls = svgContext_.getSVGContent().getElementsByTagNameNS(NS.SVG, '*'); const allEls = svgContext_.getSVGContent().getElementsByTagNameNS(NS.SVG, '*');
const allLen = allEls.length; const allLen = allEls.length;
let i, j; let i; let j;
for (i = 0; i < allLen; i++) { for (i = 0; i < allLen; i++) {
const el = allEls[i]; const el = allEls[i];
for (j = 0; j < alen; j++) { for (j = 0; j < alen; j++) {

8
src/svgcanvas/svgcanvas.js
View File

@@ -1131,8 +1131,8 @@ class SvgCanvas {
if (!elemsToRemove.length) { return; } if (!elemsToRemove.length) { return; }
// find every element and remove it from our array copy // find every element and remove it from our array copy
const newSelectedItems = [], const newSelectedItems = [];
len = selectedElements.length; const len = selectedElements.length;
for (let i = 0; i < len; ++i) { for (let i = 0; i < len; ++i) {
const elem = selectedElements[i]; const elem = selectedElements[i];
if (elem) { if (elem) {
@@ -1175,8 +1175,8 @@ class SvgCanvas {
maxx: null, maxx: null,
maxy: null maxy: null
}; };
const THRESHOLD_DIST = 0.8, const THRESHOLD_DIST = 0.8;
STEP_COUNT = 10; const STEP_COUNT = 10;
let dAttr = null; let dAttr = null;
let startX = null; let startX = null;
let startY = null; let startY = null;

18
src/svgcanvas/text-actions.js
View File

@@ -43,7 +43,7 @@ export const textActionsMethod = (function () {
let chardata = []; let chardata = [];
let textbb; // , transbb; let textbb; // , transbb;
let matrix; let matrix;
let lastX, lastY; let lastX; let lastY;
let allowDbl; let allowDbl;
/** /**
@@ -135,10 +135,10 @@ export const textActionsMethod = (function () {
cursor.setAttribute('visibility', 'hidden'); cursor.setAttribute('visibility', 'hidden');
const tl = ptToScreen(startbb.x, textbb.y), const tl = ptToScreen(startbb.x, textbb.y);
tr = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y), const tr = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y);
bl = ptToScreen(startbb.x, textbb.y + textbb.height), const bl = ptToScreen(startbb.x, textbb.y + textbb.height);
br = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y + textbb.height); const br = ptToScreen(startbb.x + (endbb.x - startbb.x), textbb.y + textbb.height);
const dstr = 'M' + tl.x + ',' + tl.y + const dstr = 'M' + tl.x + ',' + tl.y +
' L' + tr.x + ',' + tr.y + ' L' + tr.x + ',' + tr.y +
@@ -276,9 +276,9 @@ export const textActionsMethod = (function () {
function selectWord (evt) { function selectWord (evt) {
if (!allowDbl || !curtext) { return; } if (!allowDbl || !curtext) { return; }
const currentZoom = textActionsContext_.getCurrentZoom(); const currentZoom = textActionsContext_.getCurrentZoom();
const ept = transformPoint(evt.pageX, evt.pageY, textActionsContext_.getrootSctm()), const ept = transformPoint(evt.pageX, evt.pageY, textActionsContext_.getrootSctm());
mouseX = ept.x * currentZoom, const mouseX = ept.x * currentZoom;
mouseY = ept.y * currentZoom; const mouseY = ept.y * currentZoom;
const pt = screenToPt(mouseX, mouseY); const pt = screenToPt(mouseX, mouseY);
const index = getIndexFromPoint(pt.x, pt.y); const index = getIndexFromPoint(pt.x, pt.y);
@@ -461,7 +461,7 @@ export const textActionsMethod = (function () {
*/ */
init (_inputElem) { init (_inputElem) {
if (!curtext) { return; } if (!curtext) { return; }
let i, end; let i; let end;
// if (supportsEditableText()) { // if (supportsEditableText()) {
// curtext.select(); // curtext.select();
// return; // return;

4
src/svgcanvas/undo.js
View File

@@ -245,8 +245,8 @@ export const changeSelectedAttributeNoUndoMethod = function (attr, newValue, ele
const center = transformPoint( const center = transformPoint(
box.x + box.width / 2, box.y + box.height / 2, transformListToTransform(tlist).matrix box.x + box.width / 2, box.y + box.height / 2, transformListToTransform(tlist).matrix
); );
const cx = center.x, const cx = center.x;
cy = center.y; const cy = center.y;
const newrot = undoContext_.getSVGRoot().createSVGTransform(); const newrot = undoContext_.getSVGRoot().createSVGTransform();
newrot.setRotate(angle, cx, cy); newrot.setRotate(angle, cx, cy);
tlist.insertItemBefore(newrot, n); tlist.insertItemBefore(newrot, n);

28
src/svgcanvas/utilities.js
View File

@@ -163,8 +163,8 @@ export function encode64(input) {
} }
const output = new Array(Math.floor((input.length + 2) / 3) * 4); const output = new Array(Math.floor((input.length + 2) / 3) * 4);
let i = 0, let i = 0;
p = 0; let p = 0;
do { do {
const chr1 = input.charCodeAt(i++); const chr1 = input.charCodeAt(i++);
const chr2 = input.charCodeAt(i++); const chr2 = input.charCodeAt(i++);
@@ -264,9 +264,9 @@ export const dataURLToObjectURL = function (dataurl) {
if (typeof Uint8Array === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) { if (typeof Uint8Array === 'undefined' || typeof Blob === 'undefined' || typeof URL === 'undefined' || !URL.createObjectURL) {
return ''; return '';
} }
const arr = dataurl.split(','), const arr = dataurl.split(',');
mime = arr[0].match(/:(.*?);/)[1], const mime = arr[0].match(/:(.*?);/)[1];
bstr = atob(arr[1]); const bstr = atob(arr[1]);
/* /*
const [prefix, suffix] = dataurl.split(','), const [prefix, suffix] = dataurl.split(','),
{groups: {mime}} = prefix.match(/:(?<mime>.*?);/), {groups: {mime}} = prefix.match(/:(?<mime>.*?);/),
@@ -333,7 +333,7 @@ export const text2xml = function (sXML) {
sXML = sXML.replace(/<(\/?)svg:/g, '<$1').replace('xmlns:svg', 'xmlns'); sXML = sXML.replace(/<(\/?)svg:/g, '<$1').replace('xmlns:svg', 'xmlns');
} }
let out, dXML; let out; let dXML;
try { try {
dXML = (window.DOMParser) ? new DOMParser() : new window.ActiveXObject('Microsoft.XMLDOM'); dXML = (window.DOMParser) ? new DOMParser() : new window.ActiveXObject('Microsoft.XMLDOM');
dXML.async = false; dXML.async = false;
@@ -514,9 +514,9 @@ export const getPathBBox = function (path) {
bounds[1].push(P0[1]); bounds[1].push(P0[1]);
if (seg.x1) { if (seg.x1) {
const P1 = [ seg.x1, seg.y1 ], const P1 = [ seg.x1, seg.y1 ];
P2 = [ seg.x2, seg.y2 ], const P2 = [ seg.x2, seg.y2 ];
P3 = [ seg.x, seg.y ]; const P3 = [ seg.x, seg.y ];
for (let j = 0; j < 2; j++) { for (let j = 0; j < 2; j++) {
const calc = getCalc(j, P1, P2, P3); const calc = getCalc(j, P1, P2, P3);
@@ -573,7 +573,7 @@ function groupBBFix(selected) {
} }
const ref = editorContext_.getDataStorage().get(selected, 'ref'); const ref = editorContext_.getDataStorage().get(selected, 'ref');
let matched = null; let matched = null;
let ret, copy; let ret; let copy;
if (ref) { if (ref) {
let elements = []; let elements = [];
@@ -737,7 +737,7 @@ export const getPathDFromSegments = function (pathSegments) {
export const getPathDFromElement = function (elem) { export const getPathDFromElement = function (elem) {
// Possibly the cubed root of 6, but 1.81 works best // Possibly the cubed root of 6, but 1.81 works best
let num = 1.81; let num = 1.81;
let d, rx, ry; let d; let rx; let ry;
switch (elem.tagName) { switch (elem.tagName) {
case 'ellipse': case 'ellipse':
case 'circle': { case 'circle': {
@@ -779,9 +779,9 @@ export const getPathDFromElement = function (elem) {
rx = elem.getAttribute('rx'); rx = elem.getAttribute('rx');
ry = elem.getAttribute('ry'); ry = elem.getAttribute('ry');
const b = elem.getBBox(); const b = elem.getBBox();
const { x, y } = b, const { x, y } = b;
w = b.width, const w = b.width;
h = b.height; const h = b.height;
num = 4 - num; // Why? Because! num = 4 - num; // Why? Because!
d = (!rx && !ry) d = (!rx && !ry)