excalidraw/src/element/sizeHelpers.ts

110 lines
2.7 KiB
TypeScript
Raw Normal View History

import { ExcalidrawElement } from "./types";
import { mutateElement } from "./mutateElement";
import { isLinearElement } from "./typeChecks";
import { SHIFT_LOCKING_ANGLE } from "../constants";
export function isInvisiblySmallElement(element: ExcalidrawElement): boolean {
if (isLinearElement(element)) {
Fix issues related to history (#701) * Separate UI from Canvas * Explicitly define history recording * ActionManager: Set syncActionState during construction instead of in every call * Add commit to history flag to necessary actions * Disable undoing during multiElement * Write custom equality function for UI component to render it only when specific props and elements change * Remove stale comments about history skipping * Stop undo/redoing when in resizing element mode * wip * correctly reset resizingElement & add undo check * Separate selection element from the rest of the array and stop redrawing the UI when dragging the selection * Remove selectionElement from local storage * Remove unnecessary readonly type casting in actionFinalize * Fix undo / redo for multi points * Fix an issue that did not update history when elements were locked * Disable committing to history for noops - deleteSelected without deleting anything - Basic selection * Use generateEntry only inside history and pass elements and appstate to history * Update component after every history resume * Remove last item from the history only if in multi mode * Resume recording when element type is not selection * ensure we prevent hotkeys only on writable elements * Remove selection clearing from history * Remove one point arrows as they are invisibly small * Remove shape of elements from local storage * Fix removing invisible element from the array * add missing history resuming cases & simplify slice * fix lint * don't regenerate elements if no elements deselected * regenerate elements array on selection * reset state.selectionElement unconditionally * Use getter instead of passing appState and scene data through functions to actions * fix import Co-authored-by: David Luzar <luzar.david@gmail.com>
2020-02-05 22:47:10 +04:00
return element.points.length < 2;
}
return element.width === 0 && element.height === 0;
}
/**
* Makes a perfect shape or diagonal/horizontal/vertical line
*/
export function getPerfectElementSize(
elementType: string,
width: number,
2020-01-24 12:04:54 +02:00
height: number,
): { width: number; height: number } {
const absWidth = Math.abs(width);
const absHeight = Math.abs(height);
if (elementType === "line" || elementType === "arrow") {
const lockedAngle =
Math.round(Math.atan(absHeight / absWidth) / SHIFT_LOCKING_ANGLE) *
SHIFT_LOCKING_ANGLE;
if (lockedAngle === 0) {
height = 0;
} else if (lockedAngle === Math.PI / 2) {
width = 0;
} else {
height =
Math.round(absWidth * Math.tan(lockedAngle)) * Math.sign(height) ||
height;
}
} else if (elementType !== "selection") {
height = absWidth * Math.sign(height);
}
return { width, height };
}
export function resizePerfectLineForNWHandler(
element: ExcalidrawElement,
x: number,
2020-01-24 12:04:54 +02:00
y: number,
) {
const anchorX = element.x + element.width;
const anchorY = element.y + element.height;
const distanceToAnchorX = x - anchorX;
const distanceToAnchorY = y - anchorY;
if (Math.abs(distanceToAnchorX) < Math.abs(distanceToAnchorY) / 2) {
mutateElement(element, {
x: anchorX,
width: 0,
y,
height: -distanceToAnchorY,
});
} else if (Math.abs(distanceToAnchorY) < Math.abs(element.width) / 2) {
mutateElement(element, {
y: anchorY,
height: 0,
});
} else {
const nextHeight =
Math.sign(distanceToAnchorY) *
Math.sign(distanceToAnchorX) *
element.width;
mutateElement(element, {
x,
y: anchorY - nextHeight,
width: -distanceToAnchorX,
height: nextHeight,
});
}
}
/**
* @returns {boolean} whether element was normalized
*/
export function normalizeDimensions(
element: ExcalidrawElement | null,
): element is ExcalidrawElement {
if (
!element ||
(element.width >= 0 && element.height >= 0) ||
isLinearElement(element)
) {
return false;
}
if (element.width < 0) {
const nextWidth = Math.abs(element.width);
mutateElement(element, {
width: nextWidth,
x: element.x - nextWidth,
});
}
if (element.height < 0) {
const nextHeight = Math.abs(element.height);
mutateElement(element, {
height: nextHeight,
y: element.y - nextHeight,
});
}
return true;
}