diff options
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx | 19 | ||||
| -rw-r--r-- | src/client/views/collections/collectionFreeForm/MarqueeView.tsx | 3 |
2 files changed, 13 insertions, 9 deletions
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index df690da49..bb1d560d6 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -646,7 +646,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P if (CurrentUserUtils.SelectedTool !== InkTool.None) { this._currPoint = { X: e.clientX, Y: e.clientY }; // Erasing ink strokes if intersections occur. - this.eraseInkStrokes(this.getEraserIntersections()); + this.eraseInkStrokes(e, this.getEraserIntersections()); } if (InteractionUtils.IsType(e, InteractionUtils.TOUCHTYPE)) { if (this.props.isContentActive(true)) e.stopPropagation(); @@ -668,19 +668,22 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P * and deletes the original stroke. * @param eraserIntersections The intersections made by the eraser. */ - eraseInkStrokes = (eraserIntersections: Intersection[]) => { + eraseInkStrokes = (e: PointerEvent, eraserIntersections: Intersection[]) => { eraserIntersections.forEach(intersect => { const ink = intersect.ink; if (ink && !this._deleteList.includes(ink)) { this._deleteList.push(ink); SetActiveInkWidth(StrCast(ink.rootDoc.strokeWidth?.toString()) || "1"); SetActiveInkColor(StrCast(ink.rootDoc.color?.toString()) || "black"); - // create a new curve by appending all curves of the current segment together in order to render a single new stroke. - this.segmentInkStroke(ink, intersect.t ?? 0).forEach(segment => - GestureOverlay.Instance.dispatchGesture(GestureUtils.Gestures.Stroke, - segment.reduce((data, curve) => [...data, ...curve.points - .map(p => ink.ComponentView?.ptToScreen?.({ X: p.x, Y: p.y }) ?? { X: 0, Y: 0 }) - ], [] as PointData[]))); + // Piecewise ink deletion mode if the 'Alt' is not held down. + if (!e.altKey) { + // create a new curve by appending all curves of the current segment together in order to render a single new stroke. + this.segmentInkStroke(ink, intersect.t ?? 0).forEach(segment => + GestureOverlay.Instance.dispatchGesture(GestureUtils.Gestures.Stroke, + segment.reduce((data, curve) => [...data, ...curve.points + .map(p => ink.ComponentView?.ptToScreen?.({ X: p.x, Y: p.y }) ?? { X: 0, Y: 0 }) + ], [] as PointData[]))); + } // Lower ink opacity to give the user a visual indicator of deletion. ink.layoutDoc.opacity = 0.5; } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 24a7d77e0..08da682bb 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -647,8 +647,9 @@ export class MarqueeView extends React.Component<SubCollectionViewProps & Marque return <div className="marqueeView" style={{ overflow: StrCast(this.props.Document._overflow), - cursor: "hand" + cursor: CurrentUserUtils.SelectedTool === InkTool.Pen ? "crosshair" : "pointer" }} + onDragOver={e => e.preventDefault()} onScroll={(e) => e.currentTarget.scrollTop = e.currentTarget.scrollLeft = 0} onClick={this.onClick} onPointerDown={this.onPointerDown}> {this._visible ? this.marqueeDiv : null} |