keep resizing logic in sync with master

This commit is contained in:
Ryan Di 2023-11-22 17:21:13 +08:00
parent 25ab75cb9b
commit c951a001f7

View File

@ -8238,27 +8238,8 @@ class App extends React.Component<AppProps, AppState> {
event[KEYS.CTRL_OR_CMD] ? null : this.state.gridSize, event[KEYS.CTRL_OR_CMD] ? null : this.state.gridSize,
); );
const frameElementsOffsetsMap = new Map< const resizingSingleFrameOnly =
string, selectedElements.length === 1 && selectedFrames.length === 1;
{
x: number;
y: number;
}
>();
selectedFrames.forEach((frame) => {
const elementsInFrame = getFrameChildren(
this.scene.getNonDeletedElements(),
frame.id,
);
elementsInFrame.forEach((element) => {
frameElementsOffsetsMap.set(frame.id + element.id, {
x: element.x - frame.x,
y: element.y - frame.y,
});
});
});
// check needed for avoiding flickering when a key gets pressed // check needed for avoiding flickering when a key gets pressed
// during dragging // during dragging
@ -8299,12 +8280,12 @@ class App extends React.Component<AppProps, AppState> {
transformElements( transformElements(
pointerDownState, pointerDownState,
transformHandleType, transformHandleType,
selectedFrames.length > 1 resizingSingleFrameOnly
? this.scene.getSelectedElements({ ? selectedElements
: this.scene.getSelectedElements({
selectedElementIds: this.state.selectedElementIds, selectedElementIds: this.state.selectedElementIds,
includeElementsInFrames: true, includeElementsInFrames: true,
}) }),
: selectedElements,
pointerDownState.resize.arrowDirection, pointerDownState.resize.arrowDirection,
shouldRotateWithDiscreteAngle(event), shouldRotateWithDiscreteAngle(event),
shouldResizeFromCenter(event), shouldResizeFromCenter(event),
@ -8320,49 +8301,14 @@ class App extends React.Component<AppProps, AppState> {
) { ) {
this.maybeSuggestBindingForAll(selectedElements); this.maybeSuggestBindingForAll(selectedElements);
if (selectedFrames.length === 1) { // only need to highlight elements in a single resizing frame
if (resizingSingleFrameOnly) {
const elementsToHighlight = new Set<ExcalidrawElement>(); const elementsToHighlight = new Set<ExcalidrawElement>();
selectedFrames.forEach((frame) => {
const elementsInFrame = getFrameChildren(
this.scene.getNonDeletedElements(),
frame.id,
);
// keep elements' positions relative to their frames on frames resizing
if (transformHandleType) {
if (transformHandleType.includes("w")) {
elementsInFrame.forEach((element) => {
mutateElement(element, {
x:
frame.x +
(frameElementsOffsetsMap.get(frame.id + element.id)?.x ||
0),
y:
frame.y +
(frameElementsOffsetsMap.get(frame.id + element.id)?.y ||
0),
});
});
}
if (transformHandleType.includes("n")) {
elementsInFrame.forEach((element) => {
mutateElement(element, {
x:
frame.x +
(frameElementsOffsetsMap.get(frame.id + element.id)?.x ||
0),
y:
frame.y +
(frameElementsOffsetsMap.get(frame.id + element.id)?.y ||
0),
});
});
}
}
selectedFrames.forEach((selectedFrame) => {
getElementsInResizingFrame( getElementsInResizingFrame(
this.scene.getNonDeletedElements(), this.scene.getNonDeletedElements(),
frame, selectedFrame,
this.state, this.state,
).forEach((element) => elementsToHighlight.add(element)); ).forEach((element) => elementsToHighlight.add(element));
}); });