From 3bba8465a3d823596e7f8cfab24b9afa9c05cf2c Mon Sep 17 00:00:00 2001 From: eleanor-park Date: Wed, 10 Apr 2024 22:04:55 -0400 Subject: eraser circled created --- src/client/views/InkingStroke.tsx | 31 ++++++----- .../collectionFreeForm/CollectionFreeFormView.tsx | 65 +++++++++++----------- 2 files changed, 51 insertions(+), 45 deletions(-) (limited to 'src') diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx index a91fc5995..764062682 100644 --- a/src/client/views/InkingStroke.tsx +++ b/src/client/views/InkingStroke.tsx @@ -334,22 +334,27 @@ export class InkingStroke extends ViewBoxBaseComponent() impleme // const ptsXscale = (NumCast(radius) - NumCast(radius)) / (oldXrange.max - oldXrange.min || 1) || 1; // const ptsYscale = (NumCast(doc._height) - NumCast(doc.stroke_width)) / (oldYrange.max - oldYrange.min || 1) || 1; // const newPoints = func(this.DocumentView?.(), ink, ptsXscale, ptsYscale, NumCast(radius)); + const controlPointDistance = 0.552284749831 * radius; // tan(pi / 8) * radius const points: { X: number; Y: number }[] = [ - { X: inkCoords.X + radius, Y: inkCoords.Y }, - { X: inkCoords.X + radius, Y: inkCoords.Y - radius }, - { X: inkCoords.X + radius, Y: inkCoords.Y - radius }, - { X: inkCoords.X, Y: inkCoords.Y - radius }, - { X: inkCoords.X - radius, Y: inkCoords.Y - radius }, - { X: inkCoords.X - radius, Y: inkCoords.Y - radius }, - { X: inkCoords.X - radius, Y: inkCoords.Y }, - { X: inkCoords.X - radius, Y: inkCoords.Y + radius }, - { X: inkCoords.X - radius, Y: inkCoords.Y + radius }, - { X: inkCoords.X, Y: inkCoords.Y + radius }, - { X: inkCoords.X + radius, Y: inkCoords.Y + radius }, - { X: inkCoords.X + radius, Y: inkCoords.Y + radius } + { X: inkCoords.X + radius, Y: inkCoords.Y }, // right point + { X: inkCoords.X + radius, Y: inkCoords.Y - controlPointDistance }, // right's top ctrl point + { X: inkCoords.X + controlPointDistance, Y: inkCoords.Y - radius }, // top's right ctrl point + { X: inkCoords.X, Y: inkCoords.Y - radius }, // top + { X: inkCoords.X, Y: inkCoords.Y - radius }, // top again + { X: inkCoords.X - controlPointDistance, Y: inkCoords.Y - radius }, // top's left ctrl point + { X: inkCoords.X - radius, Y: inkCoords.Y - controlPointDistance }, // left's top ctrl point + { X: inkCoords.X - radius, Y: inkCoords.Y }, // left + { X: inkCoords.X - radius, Y: inkCoords.Y }, // left again + { X: inkCoords.X - radius, Y: inkCoords.Y + controlPointDistance }, // left's bottom ctrl point + { X: inkCoords.X - controlPointDistance, Y: inkCoords.Y + radius }, // bottom's left ctrl point + { X: inkCoords.X, Y: inkCoords.Y + radius }, // bottom + { X: inkCoords.X, Y: inkCoords.Y + radius }, // bottom again + { X: inkCoords.X + controlPointDistance, Y: inkCoords.Y + radius }, // bottom's right ctrl point + { X: inkCoords.X + radius, Y: inkCoords.Y + controlPointDistance }, // right's bottom ctrl point + { X: inkCoords.X + radius, Y: inkCoords.Y }, // right again ]; const eraserCircle = new InkField(points); - return points; + return eraserCircle; } _subContentView: ViewBoxInterface | undefined; diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 26afa5297..a72b499b2 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -625,8 +625,8 @@ export class CollectionFreeFormView extends CollectionSubView { - // 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 eraserBezier: Bezier = InkField.Segment(eraserInkData, i); + segment1.push(eraserBezier); + for (var j = 0; j < inkData.length; j += 4) { const inkSegment: Bezier = InkField.Segment(inkData, i); - 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)); - } else if (eraseT - eraseWidth < currCurveT) { - segment2.push(inkSegment.split(eraseT - currCurveT + eraseWidth, 1)); - } else if (eraseT + eraseWidth > currCurveT + 1) { - segment1.push(inkSegment.split(0, eraseT - currCurveT - eraseWidth)); - } - } else if (eraseT > currCurveT + 1) { - segment1.push(inkSegment); - } else { - segment2.push(inkSegment); + // 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). + // }); } } + // segment1.push(eraserBezier); + + // for (var i = 0; i < inkData.length - 3; i += 4) { + // const currCurveT = Math.floor(i/4); + // const inkSegment: Bezier = InkField.Segment(inkData, i); + // 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)); + // } else if (eraseT - eraseWidth < currCurveT) { + // segment2.push(inkSegment.split(eraseT - currCurveT + eraseWidth, 1)); + // } else if (eraseT + eraseWidth > currCurveT + 1) { + // segment1.push(inkSegment.split(0, eraseT - currCurveT - eraseWidth)); + // } + // } else if (eraseT > currCurveT + 1) { + // segment1.push(inkSegment); + // } else { + // segment2.push(inkSegment); + // } + // } // push 1 or both segments if they are not empty if (segment1.length && (Math.abs(segment1[0].points[0].x - segment1[0].points.lastElement().x) > 0.5 || Math.abs(segment1[0].points[0].y - segment1[0].points.lastElement().y) > 0.5)) { -- cgit v1.2.3-70-g09d2