From 172d791a95126cbdb2ebf59fd8c28a63698002d1 Mon Sep 17 00:00:00 2001 From: eleanor-park Date: Mon, 8 Apr 2024 23:20:18 -0400 Subject: radius erase re-implement started --- .../collectionFreeForm/CollectionFreeFormView.tsx | 38 ++++++++++++++++++---- 1 file changed, 31 insertions(+), 7 deletions(-) (limited to 'src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx') diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index da4c53d66..26afa5297 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -1,4 +1,4 @@ -import { findSegment } from '@turf/turf'; +import { findSegment, intersect } from '@turf/turf'; import { Bezier } from 'bezier-js'; import { Colors } from 'browndash-components'; import { action, computed, IReactionDisposer, makeObservable, observable, reaction, runInAction } from 'mobx'; @@ -755,8 +755,11 @@ export class CollectionFreeFormView extends CollectionSubView { + radiusErase = (ink: DocumentView, eraseT: number, inkCoords: {X: number, Y: number}): Segment[] => { const segments: Segment[] = []; var segment1: Segment = []; var segment2: Segment = []; - const eraseWidth = ActiveInkWidth() / 100; - const { inkData } = (ink?.ComponentView as InkingStroke).inkScaledData(); + const eraseWidth = ActiveInkWidth(); + const inkStroke = ink?.ComponentView as InkingStroke; + const { inkData } = (inkStroke).inkScaledData(); + + const eraserInkData = inkStroke.splitByEraser(inkCoords, eraseWidth) as InkData; + + const tVals: number[] = []; // should be the tvals of the intersections + + for (var i = 0; i < eraserInkData.length - 3; i += 4) { + const currCurveT = Math.floor(i/4); + const eraserBezier = InkField.Segment(eraserInkData, i); + for (var j = 0; j < inkData.length; j +=4) { + const inkSegment: Bezier = InkField.Segment(inkData, i); + this.bintersects(inkSegment, eraserBezier).forEach((val: string | number, i: number) => { + // Converting the Bezier.js Split type to a t-value number. + const t = +val.toString().split('/')[0]; + if (i % 2 === 0 && !tVals.includes(t)) tVals.push(t); // bcz: Hack! don't know why but intersection points are doubled from bezier.js (but not identical). + }); + } + } + for (var i = 0; i < inkData.length - 3; i += 4) { const currCurveT = Math.floor(i/4); const inkSegment: Bezier = InkField.Segment(inkData, i); - if (eraseT >= currCurveT && eraseT < currCurveT+1) { + if (tVals[0] >= currCurveT && tVals[0] < currCurveT+1) { + tVals.shift() + i -= 4; if (eraseT - eraseWidth > currCurveT && eraseT + eraseWidth < currCurveT + 1) { segment1.push(inkSegment.split(0, eraseT - currCurveT - eraseWidth)); segment2.push(inkSegment.split(eraseT - currCurveT + eraseWidth, 1)); -- cgit v1.2.3-70-g09d2