some cleanup for inlineTextAnnotations to use a better named field. removing some unused code.

3 files changed, 60 insertions, 90 deletions

diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index f03e1dd9d..63439586c 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -99,43 +99,41 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
             const scale = this.props.scaling?.() || 1;
             const anno = this.props.savedAnnotations.values()[0][0];
             const containerOffset = this.props.containerOffset?.() || [0, 0];
-            const mainAnnoDoc = Docs.Create.FreeformDocument([], { backgroundColor: color, annotationOn: this.props.rootDoc, title: "Annotation on " + this.props.rootDoc.title });
-            if (anno.style.left) mainAnnoDoc.x = (parseInt(anno.style.left) - containerOffset[0]) / scale;
-            if (anno.style.top) mainAnnoDoc.y = (parseInt(anno.style.top) - containerOffset[1]) / scale + NumCast(this.props.scrollTop);
-            if (anno.style.height) mainAnnoDoc._height = parseInt(anno.style.height) / scale;
-            if (anno.style.width) mainAnnoDoc._width = parseInt(anno.style.width) / scale;
-            mainAnnoDoc.group = mainAnnoDoc;
+            const marqueeAnno = Docs.Create.FreeformDocument([], { backgroundColor: color, annotationOn: this.props.rootDoc, title: "Annotation on " + this.props.rootDoc.title });
+            marqueeAnno.x = (parseInt(anno.style.left || "0") - containerOffset[0]) / scale;
+            marqueeAnno.y = (parseInt(anno.style.top || "0") - containerOffset[1]) / scale + NumCast(this.props.scrollTop);
+            marqueeAnno._height = parseInt(anno.style.height || "0") / scale;
+            marqueeAnno._width = parseInt(anno.style.width || "0") / scale;
             anno.remove();
             this.props.savedAnnotations.clear();
-            return mainAnnoDoc;
-        } else {
-            const mainAnnoDoc = Docs.Create.FreeformDocument([], { type: DocumentType.PDFANNO, annotationOn: this.props.rootDoc, title: "Selection on " + this.props.rootDoc.title, _width: 1, _height: 1 });
-            const mainAnnoDocProto = Doc.GetProto(mainAnnoDoc);
+            return marqueeAnno;
+        }
 
-            let maxX = -Number.MAX_VALUE;
-            let minY = Number.MAX_VALUE;
-            const annoDocs: Doc[] = [];
-            this.props.savedAnnotations.forEach((key: number, value: HTMLDivElement[]) => value.map(anno => {
-                const annoDoc = new Doc();
-                if (anno.style.left) annoDoc.x = parseInt(anno.style.left);
-                if (anno.style.top) annoDoc.y = parseInt(anno.style.top);
-                if (anno.style.height) annoDoc._height = parseInt(anno.style.height);
-                if (anno.style.width) annoDoc._width = parseInt(anno.style.width);
-                annoDoc.group = mainAnnoDoc;
-                annoDoc.backgroundColor = color;
-                annoDocs.push(annoDoc);
-                anno.remove();
-                (annoDoc.y !== undefined) && (minY = Math.min(NumCast(annoDoc.y), minY));
-                (annoDoc.x !== undefined) && (maxX = Math.max(NumCast(annoDoc.x) + NumCast(annoDoc._width), maxX));
-            }));
+        const textRegionAnno = Docs.Create.FreeformDocument([], { type: DocumentType.PDFANNO, annotationOn: this.props.rootDoc, title: "Selection on " + this.props.rootDoc.title, _width: 1, _height: 1 });
+        let maxX = -Number.MAX_VALUE;
+        let minY = Number.MAX_VALUE;
+        const annoDocs: Doc[] = [];
+        this.props.savedAnnotations.forEach((key: number, value: HTMLDivElement[]) => value.map(anno => {
+            const textRegion = new Doc();
+            textRegion.x = parseInt(anno.style.left ?? "0");
+            textRegion.y = parseInt(anno.style.top ?? "0");
+            textRegion._height = parseInt(anno.style.height ?? "0");
+            textRegion._width = parseInt(anno.style.width ?? "0");
+            textRegion.annoTextRegion = textRegionAnno;
+            textRegion.backgroundColor = color;
+            annoDocs.push(textRegion);
+            anno.remove();
+            minY = Math.min(NumCast(textRegion.y), minY);
+            maxX = Math.max(NumCast(textRegion.x) + NumCast(textRegion._width), maxX);
+        }));
 
-            mainAnnoDocProto.y = Math.max(minY, 0);
-            mainAnnoDocProto.x = Math.max(maxX, 0);
-            // mainAnnoDocProto.text = this._selectionText;
-            mainAnnoDocProto.annotations = new List<Doc>(annoDocs);
-            this.props.savedAnnotations.clear();
-            return mainAnnoDoc;
-        }
+        const textRegionAnnoProto = Doc.GetProto(textRegionAnno);
+        textRegionAnnoProto.y = Math.max(minY, 0);
+        textRegionAnnoProto.x = Math.max(maxX, 0);
+        // mainAnnoDocProto.text = this._selectionText;
+        textRegionAnnoProto.textInlineAnnotations = new List<Doc>(annoDocs);
+        this.props.savedAnnotations.clear();
+        return textRegionAnno;
     }
     @action
     highlight = (color: string, isLinkButton: boolean) => {
diff --git a/src/client/views/pdf/Annotation.tsx b/src/client/views/pdf/Annotation.tsx
index 4e3721e2b..913cfdcc2 100644
--- a/src/client/views/pdf/Annotation.tsx
+++ b/src/client/views/pdf/Annotation.tsx
@@ -1,15 +1,15 @@
 import React = require("react");
-import { action, IReactionDisposer, observable, reaction, runInAction } from "mobx";
+import { action, computed, IReactionDisposer, observable, reaction, runInAction } from "mobx";
 import { observer } from "mobx-react";
 import { Doc, DocListCast, HeightSym, Opt, WidthSym } from "../../../fields/Doc";
 import { Id } from "../../../fields/FieldSymbols";
 import { List } from "../../../fields/List";
-import { BoolCast, Cast, FieldValue, NumCast, PromiseValue, StrCast } from "../../../fields/Types";
+import { BoolCast, Cast, NumCast, StrCast } from "../../../fields/Types";
 import { LinkManager } from "../../util/LinkManager";
 import { undoBatch } from "../../util/UndoManager";
-import "./Annotation.scss";
+import { FieldViewProps } from "../nodes/FieldView";
 import { AnchorMenu } from "./AnchorMenu";
-import { FieldViewProps, FieldView } from "../nodes/FieldView";
+import "./Annotation.scss";
 
 interface IAnnotationProps extends FieldViewProps {
     anno: Doc;
@@ -21,7 +21,7 @@ interface IAnnotationProps extends FieldViewProps {
 export
     class Annotation extends React.Component<IAnnotationProps> {
     render() {
-        return DocListCast(this.props.anno.annotations).map(a =>
+        return DocListCast(this.props.anno.textInlineAnnotations).map(a =>
             <RegionAnnotation {...this.props} showInfo={this.props.showInfo} document={a} x={NumCast(a.x)} y={NumCast(a.y)} width={a[WidthSym]()} height={a[HeightSym]()} key={a[Id]} />);
     }
 }
@@ -35,59 +35,38 @@ interface IRegionAnnotationProps extends IAnnotationProps {
 }
 @observer
 class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
-    private _reactionDisposer?: IReactionDisposer;
-    private _brushDisposer?: IReactionDisposer;
+    private _disposers: { [name: string]: IReactionDisposer } = {};
     private _mainCont: React.RefObject<HTMLDivElement> = React.createRef();
 
-    @observable private _brushed: boolean = false;
+    @observable _brushed: boolean = false;
+    @computed get annoTextRegion() { return Cast(this.props.document.annoTextRegion, Doc, null) || this.props.document; }
 
     componentDidMount() {
-        this._reactionDisposer = reaction(
-            () => this.props.document.delete,
-            (del) => del && this._mainCont.current && (this._mainCont.current.style.display = "none"),
-            { fireImmediately: true }
-        );
-
-        this._brushDisposer = reaction(
-            () => FieldValue(Cast(this.props.document.group, Doc)) && Doc.isBrushedHighlightedDegree(FieldValue(Cast(this.props.document.group, Doc))!),
+        this._disposers.brush = reaction(
+            () => this.annoTextRegion && Doc.isBrushedHighlightedDegree(this.annoTextRegion),
             brushed => brushed !== undefined && runInAction(() => this._brushed = brushed !== 0)
         );
     }
 
     componentWillUnmount() {
-        this._brushDisposer?.();
-        this._reactionDisposer?.();
+        Object.values(this._disposers).forEach(disposer => disposer?.());
     }
 
     @undoBatch
     deleteAnnotation = () => {
-        const annotation = DocListCast(this.props.dataDoc[this.props.fieldKey + "-annotations"]);
-        const group = FieldValue(Cast(this.props.document.group, Doc));
-        if (group) {
-            if (annotation.indexOf(group) !== -1) {
-                const newAnnotations = annotation.filter(a => a !== FieldValue(Cast(this.props.document.group, Doc)));
-                this.props.dataDoc[this.props.fieldKey + "-annotations"] = new List<Doc>(newAnnotations);
-            }
-
-            DocListCast(group.annotations).forEach(anno => anno.delete = true);
-        }
+        const docAnnotations = DocListCast(this.props.dataDoc[this.props.fieldKey]);
+        this.props.dataDoc[this.props.fieldKey] = new List<Doc>(docAnnotations.filter(a => a !== this.annoTextRegion));
         AnchorMenu.Instance.fadeOut(true);
         this.props.select(false);
     }
 
     @undoBatch
-    pinToPres = () => {
-        const group = FieldValue(Cast(this.props.document.group, Doc));
-        group && this.props.pinToPres(group);
-    }
+    pinToPres = () => this.props.pinToPres(this.annoTextRegion);
 
     @undoBatch
-    makePushpin = action(() => {
-        const group = Cast(this.props.document.group, Doc, null);
-        group.isPushpin = !group.isPushpin;
-    });
+    makePushpin = () => this.annoTextRegion.isPushpin = !this.annoTextRegion.isPushpin;
 
-    isPushpin = () => BoolCast(Cast(this.props.document.group, Doc, null)?.isPushpin);
+    isPushpin = () => BoolCast(this.annoTextRegion.isPushpin);
 
     @action
     onPointerDown = (e: React.PointerEvent) => {
@@ -102,32 +81,26 @@ class RegionAnnotation extends React.Component<IRegionAnnotationProps> {
             AnchorMenu.Instance.jumpTo(e.clientX, e.clientY, true);
             e.stopPropagation();
         }
-        else if (e.button === 0 && this.props.document.group instanceof Doc) {
+        else if (e.button === 0) {
             e.stopPropagation();
-            LinkManager.FollowLink(undefined, this.props.document.group, this.props, false);
+            LinkManager.FollowLink(undefined, this.annoTextRegion, this.props, false);
         }
     }
 
-
     addTag = (key: string, value: string): boolean => {
-        const group = FieldValue(Cast(this.props.document.group, Doc));
-        if (group) {
-            const valNum = parseInt(value);
-            group[key] = isNaN(valNum) ? value : valNum;
-            return true;
-        }
-        return false;
+        const valNum = parseInt(value);
+        this.annoTextRegion[key] = isNaN(valNum) ? value : valNum;
+        return true;
     }
 
-    @observable _showInfo = false;
     render() {
-        return (<div className="pdfAnnotation" onPointerEnter={action(() => this.props.showInfo(this.props.anno))} onPointerLeave={action(() => this.props.showInfo(undefined))} onPointerDown={this.onPointerDown} ref={this._mainCont}
+        return (<div className="pdfAnnotation" onPointerEnter={() => this.props.showInfo(this.props.anno)} onPointerLeave={() => this.props.showInfo(undefined)} onPointerDown={this.onPointerDown} ref={this._mainCont}
             style={{
                 top: this.props.y,
                 left: this.props.x,
                 width: this.props.width,
                 height: this.props.height,
-                opacity: !this._showInfo && this._brushed ? 0.5 : undefined,
+                opacity: this._brushed ? 0.5 : undefined,
                 backgroundColor: this._brushed ? "orange" : StrCast(this.props.document.backgroundColor),
             }} >
         </div>);
diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx
index 720d2d92e..28d7b0954 100644
--- a/src/client/views/pdf/PDFViewer.tsx
+++ b/src/client/views/pdf/PDFViewer.tsx
@@ -23,12 +23,12 @@ import { CollectionFreeFormView } from "../collections/collectionFreeForm/Collec
 import { ViewBoxAnnotatableComponent } from "../DocComponent";
 import { MarqueeAnnotator } from "../MarqueeAnnotator";
 import { FieldViewProps } from "../nodes/FieldView";
-import { Annotation } from "./Annotation";
+import { LinkDocPreview } from "../nodes/LinkDocPreview";
 import { AnchorMenu } from "./AnchorMenu";
+import { Annotation } from "./Annotation";
 import "./PDFViewer.scss";
 const pdfjs = require('pdfjs-dist/es5/build/pdf.js');
 import React = require("react");
-import { LinkDocPreview } from "../nodes/LinkDocPreview";
 const PDFJSViewer = require("pdfjs-dist/web/pdf_viewer");
 const pdfjsLib = require("pdfjs-dist");
 const _global = (window /* browser */ || global /* node */) as any;
@@ -94,7 +94,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
     @computed get allAnnotations() {
         return DocUtils.FilterDocs(DocListCast(this.dataDoc[this.props.fieldKey + "-annotations"]), this.props.docFilters(), this.props.docRangeFilters(), undefined);
     }
-    @computed get nonDocAnnotations() { return this.allAnnotations.filter(a => a.annotations); }
+    @computed get inlineTextAnnotations() { return this.allAnnotations.filter(a => a.textInlineAnnotations); }
 
     componentDidMount = async () => {
         // change the address to be the file address of the PNG version of each page
@@ -306,7 +306,6 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
     nextAnnotation = () => {
         this.Index = Math.min(this.Index + 1, this.allAnnotations.length - 1);
         this.scrollToAnnotation(this.allAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y))[this.Index]);
-
     }
 
     @action
@@ -512,8 +511,8 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
     @computed get annotationLayer() {
         TraceMobx();
         return <div className="pdfViewerDash-annotationLayer" style={{ height: Doc.NativeHeight(this.Document), transform: `scale(${this._zoomed})` }} ref={this._annotationLayer}>
-            {this.nonDocAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map(anno =>
-                <Annotation {...this.props} showInfo={this.showInfo} dataDoc={this.dataDoc} anno={anno} key={`${anno[Id]}-annotation`} />)
+            {this.inlineTextAnnotations.sort((a, b) => NumCast(a.y) - NumCast(b.y)).map(anno =>
+                <Annotation {...this.props} fieldKey={this.fieldKey + "-annotations"} showInfo={this.showInfo} dataDoc={this.dataDoc} anno={anno} key={`${anno[Id]}-annotation`} />)
             }
         </div>;
     }
@@ -573,7 +572,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent<IViewerProps, PdfDocu
     contentZoom = () => this._zoomed;
     render() {
         TraceMobx();
-        return <div className={"pdfViewerDash" + (this.annotationsActive() ? "-interactive" : "")} ref={this._mainCont}
+        return <div className={`pdfViewerDash${this.annotationsActive() ? "-interactive" : ""}`} ref={this._mainCont}
             onScroll={this.onScroll} onWheel={this.onZoomWheel} onPointerDown={this.onPointerDown} onClick={this.onClick}
             style={{
                 overflowX: this._zoomed !== 1 ? "scroll" : undefined,