From 22a2462a6854f31f6f546d56258aec2042073d4b Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 19 Jan 2021 11:31:02 -0500 Subject: more cleanup of marquee annotator. added marquee annotator to images --- src/client/views/pdf/PDFViewer.tsx | 74 +++++++++++++++++++------------------- 1 file changed, 36 insertions(+), 38 deletions(-) (limited to 'src/client/views/pdf') diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 03ffdb2db..26f936c66 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -68,7 +68,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent = new Dictionary(); @observable private _script: CompiledScript = CompileScript("return true") as CompiledScript; @observable private Index: number = -1; - @observable private _marqueeing: boolean = false; + @observable private _marqueeing: number[] | undefined; @observable private _showWaiting = true; @observable private _showCover = false; @observable private _zoomed = 1; @@ -379,29 +379,30 @@ export class PDFViewer extends ViewBoxAnnotatableComponent v.forEach(a => a.remove())); - this._savedAnnotations.keys().forEach(k => this._savedAnnotations.setValue(k, [])); - if (e.target && (e.target as any).parentElement.className === "textLayer") { - // start selecting text if mouse down on textLayer spans + if (e.target && (e.target as any).parentElement.className !== "textLayer") { + this._marqueeing = [e.clientX, e.clientY]; // if texLayer is hit, then we select text instead of using a marquee + } else { + // clear out old marquees and initialize menu for new selection + PDFMenu.Instance.Status = "pdf"; + PDFMenu.Instance.fadeOut(true); + this._savedAnnotations.values().forEach(v => v.forEach(a => a.remove())); + this._savedAnnotations.clear(); + this._styleRule = addStyleSheetRule(PDFViewer._annotationStyle, "pdfAnnotation", { "pointer-events": "none" }); + document.addEventListener("pointermove", this.onSelectMove); + document.addEventListener("pointerup", this.onSelectEnd); } - else this._marqueeing = true; - document.addEventListener("pointermove", this.onSelectMove); - document.addEventListener("pointerup", this.onSelectEnd); - document.addEventListener("pointerup", this.removeStyle, true); } } - removeStyle = () => { - clearStyleSheetRules(PDFViewer._annotationStyle); - document.removeEventListener("pointerup", this.removeStyle); + + @action + finishMarquee = () => { + this._marqueeing = undefined; + this.props.select(false); } @action @@ -409,6 +410,21 @@ export class PDFViewer extends ViewBoxAnnotatableComponent { + clearStyleSheetRules(PDFViewer._annotationStyle); + this.props.select(false); + document.removeEventListener("pointermove", this.onSelectMove); + document.removeEventListener("pointerup", this.onSelectEnd); + + const sel = window.getSelection(); + if (sel?.type === "Range") { + const selRange = sel.getRangeAt(0); + this.createTextAnnotation(sel, selRange); + PDFMenu.Instance.jumpTo(e.clientX, e.clientY); + } + } + @action createTextAnnotation = (sel: Selection, selRange: Range) => { if (this._mainCont.current) { @@ -441,35 +457,17 @@ export class PDFViewer extends ViewBoxAnnotatableComponent { this._marqueeing = false; } - - @action - onSelectEnd = (e: PointerEvent): void => { - clearStyleSheetRules(PDFViewer._annotationStyle); - this.props.select(false); - this._savedAnnotations.clear(); - document.removeEventListener("pointermove", this.onSelectMove); - document.removeEventListener("pointerup", this.onSelectEnd); - - const sel = window.getSelection(); - if (sel?.type === "Range") { - const selRange = sel.getRangeAt(0); - this.createTextAnnotation(sel, selRange); - PDFMenu.Instance.jumpTo(e.clientX, e.clientY); - } - } - scrollXf = () => { return this._mainCont.current ? this.props.ScreenToLocalTransform().translate(0, this.layoutDoc._scrollTop || 0) : this.props.ScreenToLocalTransform(); } onClick = (e: React.MouseEvent) => { if (this._setPreviewCursor && e.button === 0 && - Math.abs(e.clientX - this._downX) < 3 && - Math.abs(e.clientY - this._downY) < 3) { + Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && + Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) { this._setPreviewCursor(e.clientX, e.clientY, false); } + e.stopPropagation(); } setPreviewCursor = (func?: (x: number, y: number, drag: boolean) => void) => this._setPreviewCursor = func; @@ -578,7 +576,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent} + } ; } } \ No newline at end of file -- cgit v1.2.3-70-g09d2