From 254f86397b90758f1f34f4b898855d082057cd15 Mon Sep 17 00:00:00 2001 From: JFH <20402845+jfhenon@users.noreply.github.com> Date: Fri, 12 Nov 2021 17:32:54 +0100 Subject: [PATCH] fix issue with text selection --- src/common/browser.js | 23 ----------------------- src/common/units.js | 15 +-------------- src/svgcanvas/event.js | 8 ++++---- src/svgcanvas/history.js | 6 +++--- src/svgcanvas/path-actions.js | 6 +++--- src/svgcanvas/selection.js | 6 +++--- src/svgcanvas/utilities.js | 14 -------------- 7 files changed, 14 insertions(+), 64 deletions(-) diff --git a/src/common/browser.js b/src/common/browser.js index 012ff07c..00e3b4b7 100644 --- a/src/common/browser.js +++ b/src/common/browser.js @@ -37,23 +37,6 @@ const supportsGoodTextCharPos_ = (function () { } }()); -// Support for correct bbox sizing on groups with horizontal/vertical lines -const supportsHVLineContainerBBox_ = (function () { - const svgcontent = document.createElementNS(NSSVG, 'svg'); - document.documentElement.append(svgcontent); - const path = document.createElementNS(NSSVG, 'path'); - path.setAttribute('d', 'M0,0 10,0'); - const path2 = document.createElementNS(NSSVG, 'path'); - path2.setAttribute('d', 'M5,0 15,0'); - const g = document.createElementNS(NSSVG, 'g'); - g.append(path, path2); - svgcontent.append(g); - const bbox = g.getBBox(); - svgcontent.remove(); - // Webkit gives 0, FF gives 10, Opera (correctly) gives 15 - return (bbox.width === 15); -}()); - // Public API /** @@ -83,12 +66,6 @@ export const isMac = () => isMac_; */ export const isTouch = () => isTouch_; -/** - * @function module:browser.supportsHVLineContainerBBox - * @returns {boolean} -*/ -export const supportsHVLineContainerBBox = () => supportsHVLineContainerBBox_; - /** * @function module:browser.supportsGoodTextCharPos * @returns {boolean} diff --git a/src/common/units.js b/src/common/units.js index 1ea24e56..e47eb923 100644 --- a/src/common/units.js +++ b/src/common/units.js @@ -11,20 +11,7 @@ const NSSVG = 'http://www.w3.org/2000/svg'; const wAttrs = [ 'x', 'x1', 'cx', 'rx', 'width' ]; const hAttrs = [ 'y', 'y1', 'cy', 'ry', 'height' ]; const unitAttrs = [ 'r', 'radius', ...wAttrs, ...hAttrs ]; -// unused -/* -const unitNumMap = { - '%': 2, - em: 3, - ex: 4, - px: 5, - cm: 6, - mm: 7, - in: 8, - pt: 9, - pc: 10 -}; -*/ + // Container of elements. let elementContainer_; diff --git a/src/svgcanvas/event.js b/src/svgcanvas/event.js index d8d024ba..44067be3 100644 --- a/src/svgcanvas/event.js +++ b/src/svgcanvas/event.js @@ -6,7 +6,7 @@ */ import { assignAttributes, cleanupElement, getElem, getRotationAngle, snapToGrid, walkTree, - isNullish, preventClickDefault, setHref + isNullish, preventClickDefault, setHref, getBBox } from './utilities.js'; import { convertAttrs @@ -201,7 +201,7 @@ export const mouseMoveEvent = function (evt) { // the shape's coordinates tlist = selected.transform.baseVal; const hasMatrix = hasMatrixTransform(tlist); - box = hasMatrix ? eventContext_.getInitBbox() : selected.getBBox(); + box = hasMatrix ? eventContext_.getInitBbox() : getBBox(selected); let left = box.x; let top = box.y; let { width, height } = box; @@ -478,7 +478,7 @@ export const mouseMoveEvent = function (evt) { break; } case 'rotate': { - box = selected.getBBox(); + box = getBBox(selected); cx = box.x + box.width / 2; cy = box.y + box.height / 2; const m = getMatrix(selected); @@ -1074,7 +1074,7 @@ export const mouseDownEvent = function (evt) { // Getting the BBox from the selection box, since we know we // want to orient around it - eventContext_.setInitBbox($id('selectedBox0').getBBox()); + eventContext_.setInitBbox(getBBox($id('selectedBox0'))); const bb = {}; for (const [ key, val ] of Object.entries(eventContext_.getInitBbox())) { bb[key] = val / currentZoom; diff --git a/src/svgcanvas/history.js b/src/svgcanvas/history.js index 6e0b5310..3ada9d9e 100644 --- a/src/svgcanvas/history.js +++ b/src/svgcanvas/history.js @@ -6,7 +6,7 @@ * @copyright 2010 Jeff Schiller */ -import { getHref, setHref, getRotationAngle, isNullish } from './utilities.js'; +import { getHref, setHref, getRotationAngle, isNullish, getBBox } from './utilities.js'; /** * Group: Undo/Redo history management. @@ -330,7 +330,7 @@ export class ChangeElementCommand extends Command { if (!bChangedTransform) { const angle = getRotationAngle(this.elem); if (angle) { - const bbox = this.elem.getBBox(); + const bbox = getBBox(this.elem); const cx = bbox.x + bbox.width / 2; const cy = bbox.y + bbox.height / 2; const rotate = [ 'rotate(', angle, ' ', cx, ',', cy, ')' ].join(''); @@ -371,7 +371,7 @@ export class ChangeElementCommand extends Command { if (!bChangedTransform) { const angle = getRotationAngle(this.elem); if (angle) { - const bbox = this.elem.getBBox(); + const bbox = getBBox(this.elem); const cx = bbox.x + bbox.width / 2; const cy = bbox.y + bbox.height / 2; const rotate = [ 'rotate(', angle, ' ', cx, ',', cy, ')' ].join(''); diff --git a/src/svgcanvas/path-actions.js b/src/svgcanvas/path-actions.js index e0f7b3dd..d35fee3f 100644 --- a/src/svgcanvas/path-actions.js +++ b/src/svgcanvas/path-actions.js @@ -15,7 +15,7 @@ import { } from './math.js'; import { assignAttributes, getElem, getRotationAngle, snapToGrid, isNullish, - getBBox as utilsGetBBox + getBBox } from './utilities.js'; let pathActionsContext_ = null; @@ -679,7 +679,7 @@ export const pathActionsMethod = (function () { // const {item} = seg; const rubberBox = editorContext_.getRubberBox(); - const rbb = rubberBox.getBBox(); + const rbb = getBBox(rubberBox); const pt = pathActionsContext_.getGripPt(seg); const ptBb = { @@ -770,7 +770,7 @@ export const pathActionsMethod = (function () { editorContext_.clearSelection(); path.setPathContext(); path.show(true).update(); - path.oldbbox = utilsGetBBox(path.elem); + path.oldbbox = getBBox(path.elem); subpath = false; }, /** diff --git a/src/svgcanvas/selection.js b/src/svgcanvas/selection.js index 436e5917..8c38387b 100644 --- a/src/svgcanvas/selection.js +++ b/src/svgcanvas/selection.js @@ -7,7 +7,7 @@ import { NS } from "./namespaces.js"; import { - getBBox as utilsGetBBox, + getBBox, getStrokedBBoxDefaultVisible } from "./utilities.js"; import { @@ -286,7 +286,7 @@ export const getIntersectionListMethod = function (rect) { let rubberBBox; if (!rect) { - rubberBBox = selectionContext_.getRubberBox().getBBox(); + rubberBBox = getBBox(selectionContext_.getRubberBox()); const bb = selectionContext_.getSVGContent().createSVGRect(); [ "x", "y", "width", "height", "top", "right", "bottom", "left" ].forEach( @@ -379,7 +379,7 @@ export const setRotationAngle = function (val, preventUndo) { val = Number.parseFloat(val); const elem = selectedElements[0]; const oldTransform = elem.getAttribute("transform"); - const bbox = utilsGetBBox(elem); + const bbox = getBBox(elem); const cx = bbox.x + bbox.width / 2; const cy = bbox.y + bbox.height / 2; const tlist = elem.transform.baseVal; diff --git a/src/svgcanvas/utilities.js b/src/svgcanvas/utilities.js index 451aca3f..45993d8e 100644 --- a/src/svgcanvas/utilities.js +++ b/src/svgcanvas/utilities.js @@ -854,20 +854,6 @@ export const getBBoxWithTransform = function (elem, addSVGElementFromJson, pathA if (!goodBb) { const { matrix } = transformListToTransform(tlist); bb = transformBox(bb.x, bb.y, bb.width, bb.height, matrix).aabox; - - // Old technique that was exceedingly slow with large documents. - // - // Accurate way to get BBox of rotated element in Firefox: - // Put element in group and get its BBox - // - // Must use clone else FF freaks out - // const clone = elem.cloneNode(true); - // const g = document.createElementNS(NS.SVG, 'g'); - // const parent = elem.parentNode; - // parent.append(g); - // g.append(clone); - // const bb2 = bboxToObj(g.getBBox()); - // g.remove(); } } return bb;