feat: sharpness (#1931)

* feat: sharpness

* feat: fill sharp lines, et al.

* fix: rotated positioning

* chore: simplify path with Q

* fix: hit test inside sharp elements

* make sharp / round buttons work properly

* fix tsc tests

* update snapshots

* update snapshots

* fix: sharp arrow creation error

* fix merge and test

* avoid type assertion

* remove duplicate helper

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Daishi Kato 2020-08-15 00:59:43 +09:00 committed by GitHub
parent 930813387b
commit 41cb1fbeba
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 841 additions and 42 deletions

View file

@ -165,6 +165,9 @@ export const getArrowPoints = (
shape: Drawable[],
) => {
const ops = getCurvePathOps(shape[0]);
if (ops.length < 1) {
return null;
}
const data = ops[ops.length - 1].data;
const p3 = [data[4], data[5]] as Point;
@ -339,10 +342,13 @@ export const getResizedElementAbsoluteCoords = (
);
const gen = rough.generator();
const curve = gen.curve(
points as [number, number][],
generateRoughOptions(element),
);
const curve =
element.strokeSharpness === "sharp"
? gen.linearPath(
points as [number, number][],
generateRoughOptions(element),
)
: gen.curve(points as [number, number][], generateRoughOptions(element));
const ops = getCurvePathOps(curve);
const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops);
return [
@ -356,13 +362,17 @@ export const getResizedElementAbsoluteCoords = (
export const getElementPointsCoords = (
element: ExcalidrawLinearElement,
points: readonly (readonly [number, number])[],
sharpness: ExcalidrawElement["strokeSharpness"],
): [number, number, number, number] => {
// This might be computationally heavey
const gen = rough.generator();
const curve = gen.curve(
points as [number, number][],
generateRoughOptions(element),
);
const curve =
sharpness === "sharp"
? gen.linearPath(
points as [number, number][],
generateRoughOptions(element),
)
: gen.curve(points as [number, number][], generateRoughOptions(element));
const ops = getCurvePathOps(curve);
const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops);
return [