From 860c7907268874f1754dd86bc3a984066552db12 Mon Sep 17 00:00:00 2001
From: bob <bcz@cs.brown.edu>
Date: Thu, 12 Dec 2019 15:02:22 -0500
Subject: major changes to drag and drop

---
 src/client/views/linking/LinkMenuGroup.tsx | 28 ++++++----------------------
 1 file changed, 6 insertions(+), 22 deletions(-)

(limited to 'src/client/views/linking/LinkMenuGroup.tsx')

diff --git a/src/client/views/linking/LinkMenuGroup.tsx b/src/client/views/linking/LinkMenuGroup.tsx
index 15aacbbc9..da56435f2 100644
--- a/src/client/views/linking/LinkMenuGroup.tsx
+++ b/src/client/views/linking/LinkMenuGroup.tsx
@@ -4,11 +4,9 @@ import { observer } from "mobx-react";
 import { Doc } from "../../../new_fields/Doc";
 import { Id } from "../../../new_fields/FieldSymbols";
 import { SchemaHeaderField } from "../../../new_fields/SchemaHeaderField";
-import { emptyFunction } from "../../../Utils";
 import { Docs } from "../../documents/Documents";
 import { DragManager, SetupDrag } from "../../util/DragManager";
 import { LinkManager } from "../../util/LinkManager";
-import { UndoManager } from "../../util/UndoManager";
 import { DocumentView } from "../nodes/DocumentView";
 import './LinkMenu.scss';
 import { LinkMenuItem } from "./LinkMenuItem";
@@ -21,7 +19,6 @@ interface LinkMenuGroupProps {
     showEditor: (linkDoc: Doc) => void;
     addDocTab: (document: Doc, dataDoc: Doc | undefined, where: string) => boolean;
     docView: DocumentView;
-
 }
 
 @observer
@@ -44,27 +41,14 @@ export class LinkMenuGroup extends React.Component<LinkMenuGroupProps> {
         e.stopPropagation();
     }
 
-
     onLinkButtonMoved = async (e: PointerEvent) => {
-        UndoManager.RunInBatch(() => {
-            if (this._drag.current !== null && (e.movementX > 1 || e.movementY > 1)) {
-                document.removeEventListener("pointermove", this.onLinkButtonMoved);
-                document.removeEventListener("pointerup", this.onLinkButtonUp);
+        if (this._drag.current && (e.movementX > 1 || e.movementY > 1)) {
+            document.removeEventListener("pointermove", this.onLinkButtonMoved);
+            document.removeEventListener("pointerup", this.onLinkButtonUp);
 
-                const draggedDocs = this.props.group.map(linkDoc => {
-                    const opp = LinkManager.Instance.getOppositeAnchor(linkDoc, this.props.sourceDoc);
-                    if (opp) return opp;
-                }) as Doc[];
-                const dragData = new DragManager.DocumentDragData(draggedDocs);
-
-                DragManager.StartLinkedDocumentDrag([this._drag.current], dragData, e.x, e.y, {
-                    handlers: {
-                        dragComplete: action(emptyFunction),
-                    },
-                    hideSource: false
-                });
-            }
-        }, "drag links");
+            let targets = this.props.group.map(l => LinkManager.Instance.getOppositeAnchor(l, this.props.sourceDoc)).filter(d => d) as Doc[];
+            DragManager.StartLinkTargetsDrag(this._drag.current!, e.x, e.y, this.props.sourceDoc, targets);
+        }
         e.stopPropagation();
     }
 
-- 
cgit v1.2.3-70-g09d2


From eead07720f1f196e9ee81cd44b26759dc44e04f9 Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Thu, 12 Dec 2019 21:00:36 -0500
Subject: fixed warnings.  Limited the size of pasted text boxes

---
 src/client/documents/Documents.ts           |  1 +
 src/client/util/DragManager.ts              | 14 ++++++-------
 src/client/views/DocumentButtonBar.tsx      |  2 +-
 src/client/views/PreviewCursor.tsx          | 32 +++++++++++------------------
 src/client/views/ScriptBox.tsx              |  2 +-
 src/client/views/linking/LinkMenuGroup.tsx  |  2 +-
 src/client/views/nodes/FormattedTextBox.tsx | 11 +++++++---
 7 files changed, 30 insertions(+), 34 deletions(-)

(limited to 'src/client/views/linking/LinkMenuGroup.tsx')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 5d5bdfcbd..7df08c7e6 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -112,6 +112,7 @@ export interface DocumentOptions {
     dropConverter?: ScriptField; // script to run when documents are dropped on this Document.
     strokeWidth?: number;
     color?: string;
+    limitHeight?:number; // maximum height for newly created (eg, from pasting) text documents
     // [key: string]: Opt<Field>;
 }
 
diff --git a/src/client/util/DragManager.ts b/src/client/util/DragManager.ts
index 95529311a..326262895 100644
--- a/src/client/util/DragManager.ts
+++ b/src/client/util/DragManager.ts
@@ -101,10 +101,10 @@ export namespace DragManager {
     export class DragCompleteEvent {
         constructor(aborted: boolean, dragData: { [id: string]: any }) {
             this.aborted = aborted;
-            this.docDragData = dragData instanceof DocumentDragData ? dragData as DocumentDragData : undefined;
-            this.annoDragData = dragData instanceof PdfAnnoDragData ? dragData as PdfAnnoDragData : undefined;
-            this.linkDragData = dragData instanceof LinkDragData ? dragData as LinkDragData : undefined;
-            this.columnDragData = dragData instanceof ColumnDragData ? dragData as ColumnDragData : undefined;
+            this.docDragData = dragData instanceof DocumentDragData ? dragData : undefined;
+            this.annoDragData = dragData instanceof PdfAnnoDragData ? dragData : undefined;
+            this.linkDragData = dragData instanceof LinkDragData ? dragData : undefined;
+            this.columnDragData = dragData instanceof ColumnDragData ? dragData : undefined;
         }
         aborted: boolean;
         docDragData?: DocumentDragData;
@@ -140,14 +140,12 @@ export namespace DragManager {
         linkSourceDocument: Doc;
         dontClearTextBox?: boolean;
         linkDocument?: Doc;
-        [id: string]: any;
     }
     export class ColumnDragData {
         constructor(colKey: SchemaHeaderField) {
             this.colKey = colKey;
         }
         colKey: SchemaHeaderField;
-        [id: string]: any;
     }
     // used by PDFs to conditionally (if the drop completes) create a text annotation when dragging from the PDF toolbar when a text region has been selected.
     // this is pretty clunky and should be rethought out using linkDrag or DocumentDrag
@@ -216,7 +214,7 @@ export namespace DragManager {
 
     // drag links and drop link targets (aliasing them if needed)
     export async function StartLinkTargetsDrag(dragEle: HTMLElement, downX: number, downY: number, sourceDoc: Doc, specificLinks?: Doc[]) {
-        let draggedDocs = (specificLinks ? specificLinks : DocListCast(sourceDoc.links)).map(link => LinkManager.Instance.getOppositeAnchor(link, sourceDoc)).filter(l => l) as Doc[];
+        const draggedDocs = (specificLinks ? specificLinks : DocListCast(sourceDoc.links)).map(link => LinkManager.Instance.getOppositeAnchor(link, sourceDoc)).filter(l => l) as Doc[];
 
         if (draggedDocs.length) {
             const moddrag: Doc[] = [];
@@ -225,7 +223,7 @@ export namespace DragManager {
                 if (doc) moddrag.push(doc);
             }
 
-            let dragData = new DragManager.DocumentDragData(moddrag.length ? moddrag : draggedDocs);
+            const dragData = new DragManager.DocumentDragData(moddrag.length ? moddrag : draggedDocs);
             dragData.moveDocument = (doc: Doc, targetCollection: Doc | undefined, addDocument: (doc: Doc) => boolean): boolean => {
                 const document = SelectionManager.SelectedDocuments()[0];
                 document && document.props.removeDocument && document.props.removeDocument(doc);
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index f014c1329..58728ab7f 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -114,7 +114,7 @@ export class DocumentButtonBar extends React.Component<{ views: DocumentView[],
                         const proto = Doc.GetProto(linkDoc);
                         proto.sourceContext = this.props.views[0].props.ContainingCollectionDoc;
 
-                        const anchor2Title = linkDoc.anchor2 instanceof Doc ? StrCast((linkDoc.anchor2 as Doc).title) : "-untitled-";
+                        const anchor2Title = linkDoc.anchor2 instanceof Doc ? StrCast(linkDoc.anchor2.title) : "-untitled-";
                         const text = FormattedTextBox.ToolTipTextMenu.makeLink(linkDoc, anchor2Title, e.ctrlKey ? "onRight" : "inTab");
                         if (linkDoc.anchor2 instanceof Doc) {
                             proto.title = text === "" ? proto.title : text + " to " + linkDoc.anchor2.title; // TODO open to more descriptive descriptions of following in text link
diff --git a/src/client/views/PreviewCursor.tsx b/src/client/views/PreviewCursor.tsx
index fd0287b6c..8adcf1220 100644
--- a/src/client/views/PreviewCursor.tsx
+++ b/src/client/views/PreviewCursor.tsx
@@ -5,7 +5,7 @@ import * as React from 'react';
 import "./PreviewCursor.scss";
 import { Docs } from '../documents/Documents';
 // import { Transform } from 'prosemirror-transform';
-import { Doc } from '../../new_fields/Doc';
+import { Doc, HeightSym } from '../../new_fields/Doc';
 import { Transform } from "../util/Transform";
 import { TraceMobx } from '../../new_fields/util';
 
@@ -27,61 +27,53 @@ export class PreviewCursor extends React.Component<{}> {
         if (PreviewCursor.Visible) {
             if (e.clipboardData) {
                 const newPoint = PreviewCursor._getTransform().transformPoint(PreviewCursor._clickPoint[0], PreviewCursor._clickPoint[1]);
-                runInAction(() => { PreviewCursor.Visible = false; });
-
+                runInAction(() => PreviewCursor.Visible = false);
 
                 if (e.clipboardData.getData("text/plain") !== "") {
 
                     // tests for youtube and makes video document
                     if (e.clipboardData.getData("text/plain").indexOf("www.youtube.com/watch") !== -1) {
                         const url = e.clipboardData.getData("text/plain").replace("youtube.com/watch?v=", "youtube.com/embed/");
-                        PreviewCursor._addDocument(Docs.Create.VideoDocument(url, {
+                        return PreviewCursor._addDocument(Docs.Create.VideoDocument(url, {
                             title: url, width: 400, height: 315,
                             nativeWidth: 600, nativeHeight: 472.5,
                             x: newPoint[0], y: newPoint[1]
                         }));
-                        return;
                     }
 
                     // tests for URL and makes web document
                     const re: any = /^https?:\/\//g;
                     if (re.test(e.clipboardData.getData("text/plain"))) {
                         const url = e.clipboardData.getData("text/plain");
-                        PreviewCursor._addDocument(Docs.Create.WebDocument(url, {
-                            title: url, width: 300, height: 300,
+                        return PreviewCursor._addDocument(Docs.Create.WebDocument(url, {
+                            title: url, width: 500, height: 300,
                             // nativeWidth: 300, nativeHeight: 472.5,
                             x: newPoint[0], y: newPoint[1]
                         }));
-                        return;
                     }
 
                     // creates text document
-                    const newBox = Docs.Create.TextDocument({
-                        width: 200, height: 100,
+                    return PreviewCursor._addLiveTextDoc(Docs.Create.TextDocument({
+                        width: 500,
+                        autoHeight: true,
                         x: newPoint[0],
                         y: newPoint[1],
+                        limitHeight: 400,
                         title: "-pasted text-"
-                    });
-
-                    newBox.proto!.autoHeight = true;
-                    PreviewCursor._addLiveTextDoc(newBox);
-                    return;
+                    }));
                 }
                 //pasting in images
                 if (e.clipboardData.getData("text/html") !== "" && e.clipboardData.getData("text/html").includes("<img src=")) {
                     const re: any = /<img src="(.*?)"/g;
                     const arr: any[] = re.exec(e.clipboardData.getData("text/html"));
 
-                    const img: Doc = Docs.Create.ImageDocument(
+                    return PreviewCursor._addDocument(Docs.Create.ImageDocument(
                         arr[1], {
                         width: 300, title: arr[1],
                         x: newPoint[0],
                         y: newPoint[1],
-                    });
-                    PreviewCursor._addDocument(img);
-                    return;
+                    }));
                 }
-
             }
         }
     }
diff --git a/src/client/views/ScriptBox.tsx b/src/client/views/ScriptBox.tsx
index 956e83238..ded2329b4 100644
--- a/src/client/views/ScriptBox.tsx
+++ b/src/client/views/ScriptBox.tsx
@@ -113,7 +113,7 @@ export class ScriptBox extends React.Component<ScriptBoxProps> {
                 return;
             }
 
-            var div = document.createElement("div");
+            const div = document.createElement("div");
             div.style.width = "90";
             div.style.height = "20";
             div.style.background = "gray";
diff --git a/src/client/views/linking/LinkMenuGroup.tsx b/src/client/views/linking/LinkMenuGroup.tsx
index da56435f2..abd17ec4d 100644
--- a/src/client/views/linking/LinkMenuGroup.tsx
+++ b/src/client/views/linking/LinkMenuGroup.tsx
@@ -46,7 +46,7 @@ export class LinkMenuGroup extends React.Component<LinkMenuGroupProps> {
             document.removeEventListener("pointermove", this.onLinkButtonMoved);
             document.removeEventListener("pointerup", this.onLinkButtonUp);
 
-            let targets = this.props.group.map(l => LinkManager.Instance.getOppositeAnchor(l, this.props.sourceDoc)).filter(d => d) as Doc[];
+            const targets = this.props.group.map(l => LinkManager.Instance.getOppositeAnchor(l, this.props.sourceDoc)).filter(d => d) as Doc[];
             DragManager.StartLinkTargetsDrag(this._drag.current!, e.x, e.y, this.props.sourceDoc, targets);
         }
         e.stopPropagation();
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index af09e57f4..a298fd6af 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -630,7 +630,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
             { fireImmediately: true }
         );
 
-        setTimeout(() => this.tryUpdateHeight(), 0);
+        setTimeout(() => this.tryUpdateHeight(NumCast(this.layoutDoc.limitHeight, 0)));
     }
 
     pushToGoogleDoc = async () => {
@@ -1087,10 +1087,15 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
     }
 
     @action
-    tryUpdateHeight() {
-        const scrollHeight = this._ref.current?.scrollHeight;
+    tryUpdateHeight(limitHeight?: number) {
+        let scrollHeight = this._ref.current?.scrollHeight;
         if (!this.layoutDoc.animateToPos && this.layoutDoc.autoHeight && scrollHeight &&
             getComputedStyle(this._ref.current!.parentElement!).top === "0px") {  // if top === 0, then the text box is growing upward (as the overlay caption) which doesn't contribute to the height computation
+            if (limitHeight && scrollHeight > limitHeight) {
+                scrollHeight = limitHeight;
+                this.layoutDoc.limitHeight = undefined;
+                this.layoutDoc.autoHeight = false;
+            }
             const nh = this.Document.isTemplateField ? 0 : NumCast(this.dataDoc.nativeHeight, 0);
             const dh = NumCast(this.layoutDoc.height, 0);
             const newHeight = Math.max(10, (nh ? dh / nh * scrollHeight : scrollHeight) + (this.props.ChromeHeight ? this.props.ChromeHeight() : 0));
-- 
cgit v1.2.3-70-g09d2

