excalidraw/src/element/resizeTest.ts
Guillermo Peralta Scura 4a044d3ace Show move and resize cursors on hover (#280)
* Change to move cursor on hover

* Show resize handlers on hover
2020-01-08 18:56:35 -08:00

52 lines
1.4 KiB
TypeScript

import { ExcalidrawElement } from "./types";
import { handlerRectangles } from "./handlerRectangles";
import { SceneScroll } from "../scene/types";
type HandlerRectanglesRet = keyof ReturnType<typeof handlerRectangles>;
export function resizeTest(
element: ExcalidrawElement,
x: number,
y: number,
{ scrollX, scrollY }: SceneScroll
): HandlerRectanglesRet | false {
if (!element.isSelected || element.type === "text") return false;
const handlers = handlerRectangles(element, { scrollX, scrollY });
const filter = Object.keys(handlers).filter(key => {
const handler = handlers[key as HandlerRectanglesRet]!;
return (
x + scrollX >= handler[0] &&
x + scrollX <= handler[0] + handler[2] &&
y + scrollY >= handler[1] &&
y + scrollY <= handler[1] + handler[3]
);
});
if (filter.length > 0) {
return filter[0] as HandlerRectanglesRet;
}
return false;
}
export function getElementWithResizeHandler(
elements: ExcalidrawElement[],
{ x, y }: { x: number; y: number },
{ scrollX, scrollY }: SceneScroll
) {
return elements.reduce((result, element) => {
if (result) {
return result;
}
const resizeHandle = resizeTest(element, x, y, {
scrollX,
scrollY
});
return resizeHandle ? { element, resizeHandle } : null;
}, null as { element: ExcalidrawElement; resizeHandle: ReturnType<typeof resizeTest> } | null);
}