Dylan/excalidraw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

apply projection to angle 0 drag move as well

Browse Source
This commit is contained in:
Ryan Di 2024-10-09 19:17:57 +08:00
parent da0481683a
commit 741c8dec31
1 changed files with 39 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
packages/excalidraw/components/App.tsx
View File

@ -7938,8 +7938,7 @@ class App extends React.Component<AppProps, AppState> {
this.imageCache.get(croppingElement.fileId)?.image; this.imageCache.get(croppingElement.fileId)?.image;
if (image && !(image instanceof Promise)) { if (image && !(image instanceof Promise)) {
// scale the offset by at least a factor of 2 to improve ux const instantDragOffset = vectorScale(
let instantDragOffset = vectorScale(
vector( vector(
pointerCoords.x - lastPointerCoords.x, pointerCoords.x - lastPointerCoords.x,
pointerCoords.y - lastPointerCoords.y, pointerCoords.y - lastPointerCoords.y,
@ -7947,63 +7946,56 @@ class App extends React.Component<AppProps, AppState> {
Math.max(this.state.zoom.value, 2), Math.max(this.state.zoom.value, 2),
); );
if (croppingElement.angle !== 0) { const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords(
const [x1, y1, x2, y2, cx, cy] = getElementAbsoluteCoords( croppingElement,
croppingElement, elementsMap,
elementsMap, );
);
const topLeft = vectorFromPoint( const topLeft = vectorFromPoint(
pointRotateRads( pointRotateRads(
pointFrom(x1, y1), pointFrom(x1, y1),
pointFrom(cx, cy), pointFrom(cx, cy),
croppingElement.angle, croppingElement.angle,
), ),
); );
const topRight = vectorFromPoint( const topRight = vectorFromPoint(
pointRotateRads( pointRotateRads(
pointFrom(x2, y1), pointFrom(x2, y1),
pointFrom(cx, cy), pointFrom(cx, cy),
croppingElement.angle, croppingElement.angle,
), ),
); );
const bottomLeft = vectorFromPoint( const bottomLeft = vectorFromPoint(
pointRotateRads( pointRotateRads(
pointFrom(x1, y2), pointFrom(x1, y2),
pointFrom(cx, cy), pointFrom(cx, cy),
croppingElement.angle, croppingElement.angle,
), ),
); );
const topEdge = vectorNormalize( const topEdge = vectorNormalize(
vectorSubtract(topRight, topLeft), vectorSubtract(topRight, topLeft),
); );
const leftEdge = vectorNormalize( const leftEdge = vectorNormalize(
vectorSubtract(bottomLeft, topLeft), vectorSubtract(bottomLeft, topLeft),
); );
/** // project instantDrafOffset onto leftEdge and topEdge to decompose
* project instantDrafOffset onto leftEdge and topEdge to decompose const offsetVector = vector(
*/ vectorDot(instantDragOffset, topEdge),
vectorDot(instantDragOffset, leftEdge),
instantDragOffset = vector( );
vectorDot(instantDragOffset, topEdge),
vectorDot(instantDragOffset, leftEdge),
);
}
const nextCrop = { const nextCrop = {
...crop, ...crop,
x: clamp( x: clamp(
crop.x - crop.x -
instantDragOffset[0] * offsetVector[0] * Math.sign(croppingElement.scale[0]),
Math.sign(croppingElement.scale[0]),
0, 0,
image.naturalWidth - crop.width, image.naturalWidth - crop.width,
), ),
y: clamp( y: clamp(
crop.y - crop.y -
instantDragOffset[1] * offsetVector[1] * Math.sign(croppingElement.scale[1]),
Math.sign(croppingElement.scale[1]),
0, 0,
image.naturalHeight - crop.height, image.naturalHeight - crop.height,
), ),