Do not snap linear elements

Signed-off-by: Mark Tolmacs <mark@lazycat.hu>
This commit is contained in:
Mark Tolmacs 2025-04-04 19:05:13 +02:00
parent 06b3750a2f
commit 6b9fa5bcc5
4 changed files with 85 additions and 63 deletions

View file

@ -525,15 +525,18 @@ export const bindLinearElement = (
}; };
} }
const points = Array.from(linearElement.points); const points = Array.from(linearElement.points);
points[edgePointIndex] = toLocalPoint(
bindPointToSnapToElementOutline( if (isArrowElement(linearElement)) {
points[edgePointIndex] = toLocalPoint(
bindPointToSnapToElementOutline(
linearElement,
hoveredElement,
startOrEnd,
elementsMap,
),
linearElement, linearElement,
hoveredElement, );
startOrEnd, }
elementsMap,
),
linearElement,
);
mutateElement(linearElement, { mutateElement(linearElement, {
points, points,

View file

@ -57,6 +57,7 @@ import { headingIsHorizontal, vectorToHeading } from "./heading";
import { bumpVersion, mutateElement } from "./mutateElement"; import { bumpVersion, mutateElement } from "./mutateElement";
import { getBoundTextElement, handleBindTextResize } from "./textElement"; import { getBoundTextElement, handleBindTextResize } from "./textElement";
import { import {
isArrowElement,
isBindingElement, isBindingElement,
isElbowArrow, isElbowArrow,
isFixedPointBinding, isFixedPointBinding,
@ -371,14 +372,17 @@ export class LinearElementEditor {
app.scene, app.scene,
app.state.zoom, app.state.zoom,
); );
newPointPosition = LinearElementEditor.createPointAt( newPointPosition = LinearElementEditor.createPointAt(
element, element,
elementsMap, elementsMap,
avoidancePoint[0] === newGlobalPointPosition[0] !isArrowElement(element) ||
avoidancePoint[0] === newGlobalPointPosition[0]
? newGlobalPointPosition[0] - ? newGlobalPointPosition[0] -
linearElementEditor.pointerOffset.x linearElementEditor.pointerOffset.x
: avoidancePoint[0], : avoidancePoint[0],
avoidancePoint[1] === newGlobalPointPosition[1] !isArrowElement(element) ||
avoidancePoint[1] === newGlobalPointPosition[1]
? newGlobalPointPosition[1] - ? newGlobalPointPosition[1] -
linearElementEditor.pointerOffset.y linearElementEditor.pointerOffset.y
: avoidancePoint[1], : avoidancePoint[1],

View file

@ -5991,20 +5991,25 @@ class App extends React.Component<AppProps, AppState> {
{ {
points: [ points: [
...points.slice(0, -1), ...points.slice(0, -1),
toLocalPoint( isArrowElement(multiElement)
getOutlineAvoidingPoint( ? toLocalPoint(
multiElement, getOutlineAvoidingPoint(
pointFrom<GlobalPoint>(scenePointerX, scenePointerY), multiElement,
multiElement.points.length - 1, pointFrom<GlobalPoint>(scenePointerX, scenePointerY),
this.scene, multiElement.points.length - 1,
this.state.zoom, this.scene,
pointFrom<GlobalPoint>( this.state.zoom,
multiElement.x + lastCommittedX + dxFromLastCommitted, pointFrom<GlobalPoint>(
multiElement.y + lastCommittedY + dyFromLastCommitted, multiElement.x + lastCommittedX + dxFromLastCommitted,
multiElement.y + lastCommittedY + dyFromLastCommitted,
),
),
multiElement,
)
: pointFrom<LocalPoint>(
lastCommittedX + dxFromLastCommitted,
lastCommittedY + dyFromLastCommitted,
), ),
),
multiElement,
),
], ],
}, },
false, false,
@ -8711,20 +8716,25 @@ class App extends React.Component<AppProps, AppState> {
{ {
points: [ points: [
...points, ...points,
toLocalPoint( isArrowElement(newElement)
getOutlineAvoidingPoint( ? toLocalPoint(
newElement, getOutlineAvoidingPoint(
pointFrom<GlobalPoint>(pointerCoords.x, pointerCoords.y), newElement,
newElement.points.length - 1, pointFrom<GlobalPoint>(
this.scene, pointerCoords.x,
this.state.zoom, pointerCoords.y,
pointFrom<GlobalPoint>( ),
newElement.x + dx, newElement.points.length - 1,
newElement.y + dy, this.scene,
), this.state.zoom,
), pointFrom<GlobalPoint>(
newElement, newElement.x + dx,
), newElement.y + dy,
),
),
newElement,
)
: pointFrom<LocalPoint>(dx, dy),
], ],
}, },
false, false,
@ -8738,20 +8748,25 @@ class App extends React.Component<AppProps, AppState> {
{ {
points: [ points: [
...points.slice(0, -1), ...points.slice(0, -1),
toLocalPoint( isArrowElement(newElement)
getOutlineAvoidingPoint( ? toLocalPoint(
newElement, getOutlineAvoidingPoint(
pointFrom<GlobalPoint>(pointerCoords.x, pointerCoords.y), newElement,
newElement.points.length - 1, pointFrom<GlobalPoint>(
this.scene, pointerCoords.x,
this.state.zoom, pointerCoords.y,
pointFrom<GlobalPoint>( ),
newElement.x + dx, newElement.points.length - 1,
newElement.y + dy, this.scene,
), this.state.zoom,
), pointFrom<GlobalPoint>(
newElement, newElement.x + dx,
), newElement.y + dy,
),
),
newElement,
)
: pointFrom<LocalPoint>(dx, dy),
], ],
}, },
false, false,

View file

@ -427,7 +427,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id1", "id": "id40",
"type": "text", "type": "text",
}, },
], ],
@ -435,7 +435,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"elbowed": false, "elbowed": false,
"endArrowhead": "arrow", "endArrowhead": "arrow",
"endBinding": { "endBinding": {
"elementId": "id3", "elementId": "id42",
"focus": -0, "focus": -0,
"gap": 5, "gap": 5,
}, },
@ -465,7 +465,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"seed": Any<Number>, "seed": Any<Number>,
"startArrowhead": null, "startArrowhead": null,
"startBinding": { "startBinding": {
"elementId": "id2", "elementId": "id41",
"focus": 0, "focus": 0,
"gap": 5, "gap": 5,
}, },
@ -488,7 +488,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"autoResize": true, "autoResize": true,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"containerId": "id0", "containerId": "id39",
"customData": undefined, "customData": undefined,
"fillStyle": "solid", "fillStyle": "solid",
"fontFamily": 5, "fontFamily": 5,
@ -529,7 +529,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id0", "id": "id39",
"type": "arrow", "type": "arrow",
}, },
], ],
@ -566,7 +566,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id0", "id": "id39",
"type": "arrow", "type": "arrow",
}, },
], ],
@ -603,7 +603,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id1", "id": "id44",
"type": "text", "type": "text",
}, },
], ],
@ -611,7 +611,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"elbowed": false, "elbowed": false,
"endArrowhead": "arrow", "endArrowhead": "arrow",
"endBinding": { "endBinding": {
"elementId": "id3", "elementId": "id46",
"focus": -0, "focus": -0,
"gap": 5, "gap": 5,
}, },
@ -641,7 +641,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"seed": Any<Number>, "seed": Any<Number>,
"startArrowhead": null, "startArrowhead": null,
"startBinding": { "startBinding": {
"elementId": "id2", "elementId": "id45",
"focus": 0, "focus": 0,
"gap": 5, "gap": 5,
}, },
@ -664,7 +664,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"autoResize": true, "autoResize": true,
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": null, "boundElements": null,
"containerId": "id0", "containerId": "id43",
"customData": undefined, "customData": undefined,
"fillStyle": "solid", "fillStyle": "solid",
"fontFamily": 5, "fontFamily": 5,
@ -706,7 +706,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id0", "id": "id43",
"type": "arrow", "type": "arrow",
}, },
], ],
@ -752,7 +752,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"backgroundColor": "transparent", "backgroundColor": "transparent",
"boundElements": [ "boundElements": [
{ {
"id": "id0", "id": "id43",
"type": "arrow", "type": "arrow",
}, },
], ],