From ae0fdf2d21505bdc7fed78f743902150ee6bdc7e Mon Sep 17 00:00:00 2001 From: Mark Tolmacs Date: Mon, 3 Mar 2025 17:00:09 +0100 Subject: [PATCH] 10% inside shape still tracks outline --- packages/element/src/binding.ts | 48 ++++++++++++------- packages/element/src/linearElementEditor.ts | 3 +- .../excalidraw/actions/actionProperties.tsx | 2 + 3 files changed, 34 insertions(+), 19 deletions(-) diff --git a/packages/element/src/binding.ts b/packages/element/src/binding.ts index 99bae44216..ba029b79d6 100644 --- a/packages/element/src/binding.ts +++ b/packages/element/src/binding.ts @@ -916,6 +916,7 @@ export const bindPointToSnapToElementOutline = ( arrow: ExcalidrawElbowArrowElement, bindableElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", + elementsMap: ElementsMap, ): GlobalPoint => { if (isDevEnv() || isTestEnv()) { invariant(arrow.points.length > 1, "Arrow should have at least 2 points"); @@ -1022,26 +1023,16 @@ export const bindPointToSnapToElementOutline = ( pointDistance(intersection ?? edgePoint, center), 1e-5, // Avoid division by zero ); - const ratio = round(currentDistance / fullDistance); - switch (true) { - case ratio > 0.5: - return pointFromVector( - vectorScale( - vectorNormalize( - vectorFromPoint(intersection ?? center, adjacentPoint), - ), - -FIXED_BINDING_DISTANCE, - ), - intersection ?? edgePoint, - ); - default: - if (elbowed) { - return headingToMidBindPoint(edgePoint, bindableElement, aabb); - } - - return edgePoint; + if (!isInside) { + return intersection; } + + if (elbowed) { + return headingToMidBindPoint(edgePoint, bindableElement, aabb); + } + + return edgePoint; }; export const avoidRectangularCorner = ( @@ -1231,6 +1222,7 @@ const updateBoundPoint = ( linearElement, bindableElement, startOrEnd === "startBinding" ? "start" : "end", + elementsMap, ).fixedPoint; const globalMidPoint = pointFrom( bindableElement.x + bindableElement.width / 2, @@ -1317,6 +1309,24 @@ const updateBoundPoint = ( ), ]; + // debugClear(); + // intersections.forEach((intersection) => { + // debugDrawPoint(intersection, { permanent: true, color: "red" }); + // }); + // debugDrawLine( + // lineSegment( + // adjacentPoint, + // pointFromVector( + // vectorScale( + // vectorNormalize(vectorFromPoint(focusPointAbsolute, adjacentPoint)), + // interceptorLength, + // ), + // adjacentPoint, + // ), + // ), + // { permanent: true, color: "green" }, + // ); + if (intersections.length > 1) { // The adjacent point is outside the shape (+ gap) newEdgePoint = intersections[0]; @@ -1340,6 +1350,7 @@ export const calculateFixedPointForElbowArrowBinding = ( linearElement: NonDeleted, hoveredElement: ExcalidrawBindableElement, startOrEnd: "start" | "end", + elementsMap: ElementsMap, ): { fixedPoint: FixedPoint } => { const bounds = [ hoveredElement.x, @@ -1351,6 +1362,7 @@ export const calculateFixedPointForElbowArrowBinding = ( linearElement, hoveredElement, startOrEnd, + elementsMap, ); const globalMidPoint = pointFrom( bounds[0] + (bounds[2] - bounds[0]) / 2, diff --git a/packages/element/src/linearElementEditor.ts b/packages/element/src/linearElementEditor.ts index c2cf8f44c6..28d77a5c88 100644 --- a/packages/element/src/linearElementEditor.ts +++ b/packages/element/src/linearElementEditor.ts @@ -250,7 +250,7 @@ export class LinearElementEditor { app.scene.getNonDeletedElements(), app.scene.getNonDeletedElementsMap(), app.state.zoom, - elbowed, + true, elbowed, ); const p = pointFrom(coords.x, coords.y); @@ -269,6 +269,7 @@ export class LinearElementEditor { }, hoveredElement, pointIndex === 0 ? "start" : "end", + app.scene.getNonDeletedElementsMap(), ); } diff --git a/packages/excalidraw/actions/actionProperties.tsx b/packages/excalidraw/actions/actionProperties.tsx index 5a309b6775..d3a01acf3c 100644 --- a/packages/excalidraw/actions/actionProperties.tsx +++ b/packages/excalidraw/actions/actionProperties.tsx @@ -1655,6 +1655,7 @@ export const actionChangeArrowType = register({ newElement, startHoveredElement, "start", + elementsMap, ) : startGlobalPoint; const finalEndPoint = endHoveredElement @@ -1662,6 +1663,7 @@ export const actionChangeArrowType = register({ newElement, endHoveredElement, "end", + elementsMap, ) : endGlobalPoint;