From 9aa0e5e812dfbc67b0542c6740d43209313a37d6 Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Tue, 17 Aug 2021 23:50:00 -0400
Subject: more updates

---
 src/client/views/pdf/AnchorMenu.tsx | 25 ++++++++++++++++---------
 1 file changed, 16 insertions(+), 9 deletions(-)

(limited to 'src/client/views/pdf/AnchorMenu.tsx')

diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 55816ed52..d098791e5 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -46,6 +46,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     @observable public Status: "marquee" | "annotation" | "" = "";
 
     public OnClick: (e: PointerEvent) => void = unimplementedFunction;
+    public OnLink: (e: PointerEvent) => void = unimplementedFunction;
     public StartDrag: (e: PointerEvent, ele: HTMLElement) => void = unimplementedFunction;
     public Highlight: (color: string, isPushpin: boolean) => Opt<Doc> = (color: string, isPushpin: boolean) => undefined;
     public GetAnchor: (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => Opt<Doc> = () => undefined;
@@ -65,7 +66,14 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
 
     componentDidMount() {
         this._disposer = reaction(() => SelectionManager.Views(),
-            selected => AnchorMenu.Instance.fadeOut(true));
+            selected => {
+                AnchorMenu.Instance.fadeOut(true)
+                this._showLinkPopup = false;
+            });
+    }
+
+    componentWillUnmount() {
+        console.log("unmount");
     }
 
     pointerDown = (e: React.PointerEvent) => {
@@ -145,14 +153,13 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                         <FontAwesomeIcon icon="comment-alt" size="lg" />
                     </button>
                 </Tooltip>,
-
-                //NOTE: link popup is currently incomplete
-                // <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
-                //     <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
-                //         <FontAwesomeIcon icon="link" size="lg" />
-                //     </button>
-                // </Tooltip>,
-                // <LinkPopup showPopup={this._showLinkPopup} />
+                //NOTE: link popup is currently in progress
+                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
+                    <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
+                        <FontAwesomeIcon icon="link" size="lg" />
+                    </button>
+                </Tooltip>,
+                <LinkPopup showPopup={this._showLinkPopup}/>
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
-- 
cgit v1.2.3-70-g09d2


From cc89a0c16246afde8bb3d891a4ede492b6644b1f Mon Sep 17 00:00:00 2001
From: geireann <geireann.lindfield@gmail.com>
Date: Wed, 18 Aug 2021 11:01:57 -0400
Subject: added search linking

---
 src/Utils.ts                                              |  1 +
 src/client/views/MarqueeAnnotator.tsx                     |  2 ++
 src/client/views/linking/LinkPopup.tsx                    |  5 ++++-
 src/client/views/nodes/formattedText/FormattedTextBox.tsx |  1 +
 src/client/views/pdf/AnchorMenu.tsx                       | 12 +++++-------
 src/client/views/search/SearchBox.tsx                     | 14 +++++++++++---
 src/client/views/topbar/TopBar.scss                       |  1 +
 7 files changed, 25 insertions(+), 11 deletions(-)

(limited to 'src/client/views/pdf/AnchorMenu.tsx')

diff --git a/src/Utils.ts b/src/Utils.ts
index 194c38a6f..f9ca8646f 100644
--- a/src/Utils.ts
+++ b/src/Utils.ts
@@ -439,6 +439,7 @@ export function emptyFunction() { }
 
 export function unimplementedFunction() { throw new Error("This function is not implemented, but should be."); }
 
+
 export type Without<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
 
 export type Predicate<K, V> = (entry: [K, V]) => boolean;
diff --git a/src/client/views/MarqueeAnnotator.tsx b/src/client/views/MarqueeAnnotator.tsx
index a3a3bce56..fa1a4cfea 100644
--- a/src/client/views/MarqueeAnnotator.tsx
+++ b/src/client/views/MarqueeAnnotator.tsx
@@ -68,6 +68,8 @@ export class MarqueeAnnotator extends React.Component<MarqueeAnnotatorProps> {
         AnchorMenu.Instance.OnClick = (e: PointerEvent) => this.props.anchorMenuClick?.()?.(this.highlight("rgba(173, 216, 230, 0.75)", true));
         AnchorMenu.Instance.Highlight = this.highlight;
         AnchorMenu.Instance.GetAnchor = (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => this.highlight("rgba(173, 216, 230, 0.75)", true, savedAnnotations);
+        AnchorMenu.Instance.onMakeAnchor = AnchorMenu.Instance.GetAnchor;
+
         /**
          * This function is used by the AnchorMenu to create an anchor highlight and a new linked text annotation.  
          * It also initiates a Drag/Drop interaction to place the text annotation.
diff --git a/src/client/views/linking/LinkPopup.tsx b/src/client/views/linking/LinkPopup.tsx
index 85fd91d9f..c8be9069c 100644
--- a/src/client/views/linking/LinkPopup.tsx
+++ b/src/client/views/linking/LinkPopup.tsx
@@ -11,9 +11,11 @@ import { SearchBox } from '../search/SearchBox';
 import { DefaultStyleProvider } from '../StyleProvider';
 import './LinkPopup.scss';
 import React = require("react");
+import { Doc, Opt } from '../../../fields/Doc';
 
 interface LinkPopupProps {
     showPopup: boolean;
+    linkFrom?: () => Doc | undefined;
     // groupType: string;
     // linkDoc: Doc;
     // docView: DocumentView;
@@ -48,6 +50,7 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
 
     render() {
         const popupVisibility = this.props.showPopup ? "block" : "none";
+        const linkDoc = this.props.linkFrom ? this.props.linkFrom : undefined;
         return (
             <div className="linkPopup-container" style={{ display: popupVisibility }}>
                 {/* <div className="linkPopup-url-container">
@@ -67,7 +70,7 @@ export class LinkPopup extends React.Component<LinkPopupProps> {
                     <SearchBox 
                         Document={CurrentUserUtils.MySearchPanelDoc}
                         DataDoc={CurrentUserUtils.MySearchPanelDoc}
-                        // linkFrom={}
+                        linkFrom={linkDoc}
                         linkSearch={true}
                         fieldKey="data"
                         dropAction="move"
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index b0b8ce75d..d1027dfd7 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -217,6 +217,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             this._editorView?.state && RichTextMenu.Instance.insertHighlight(color, this._editorView.state, this._editorView?.dispatch);
             return undefined;
         });
+        AnchorMenu.Instance.onMakeAnchor = this.getAnchor;
         /**
          * This function is used by the PDFmenu to create an anchor highlight and a new linked text annotation.  
          * It also initiates a Drag/Drop interaction to place the text annotation.
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index d098791e5..8d74b2ac4 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -45,8 +45,9 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     @observable public Highlighting: boolean = false;
     @observable public Status: "marquee" | "annotation" | "" = "";
 
+    public onMakeAnchor: () => Opt<Doc> = () => undefined; // Method to get anchor from text search
+
     public OnClick: (e: PointerEvent) => void = unimplementedFunction;
-    public OnLink: (e: PointerEvent) => void = unimplementedFunction;
     public StartDrag: (e: PointerEvent, ele: HTMLElement) => void = unimplementedFunction;
     public Highlight: (color: string, isPushpin: boolean) => Opt<Doc> = (color: string, isPushpin: boolean) => undefined;
     public GetAnchor: (savedAnnotations?: ObservableMap<number, HTMLDivElement[]>) => Opt<Doc> = () => undefined;
@@ -67,15 +68,12 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
     componentDidMount() {
         this._disposer = reaction(() => SelectionManager.Views(),
             selected => {
-                AnchorMenu.Instance.fadeOut(true)
                 this._showLinkPopup = false;
+                console.log("unmount");
+                AnchorMenu.Instance.fadeOut(true)
             });
     }
 
-    componentWillUnmount() {
-        console.log("unmount");
-    }
-
     pointerDown = (e: React.PointerEvent) => {
         setupMoveUpEvents(this, e, (e: PointerEvent) => {
             this.StartDrag(e, this._commentCont.current!);
@@ -159,7 +157,7 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                         <FontAwesomeIcon icon="link" size="lg" />
                     </button>
                 </Tooltip>,
-                <LinkPopup showPopup={this._showLinkPopup}/>
+                <LinkPopup showPopup={this._showLinkPopup} linkFrom={this.onMakeAnchor}/>
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx
index 67c7fc845..07186fe8d 100644
--- a/src/client/views/search/SearchBox.tsx
+++ b/src/client/views/search/SearchBox.tsx
@@ -23,7 +23,7 @@ const SearchBoxDocument = makeInterface(documentSchema, searchSchema);
 
 export interface SearchBoxProps extends FieldViewProps {
     linkSearch: boolean;
-    // linkFrom: Doc;
+    linkFrom?: (() => Doc | undefined) | undefined;
 }
 
 /**
@@ -108,8 +108,16 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps, SearchBoxDoc
         this._selectedResult = doc;
     });
 
-    makeLink = action((doc: Doc) => {
-        DocUtils.MakeLink({doc: doc}, {doc:doc});
+    makeLink = action((linkTo: Doc) => {
+        console.log("[makeLink-1] got here!")
+        console.log(linkTo.title);
+        if (this.props.linkFrom){
+            const linkFrom = this.props.linkFrom();
+            if (linkFrom){
+                console.log(linkFrom.title);
+                DocUtils.MakeLink({doc: linkFrom}, {doc:linkTo});
+            }
+        }
     });
 
     /**
diff --git a/src/client/views/topbar/TopBar.scss b/src/client/views/topbar/TopBar.scss
index 2ecbb536b..d04ae8a80 100644
--- a/src/client/views/topbar/TopBar.scss
+++ b/src/client/views/topbar/TopBar.scss
@@ -53,6 +53,7 @@
             .topbar-dashboards {
                 display: flex;
                 flex-direction: row;
+                gap: 5px;
             }
 
             .topbar-lozenge-dashboard {
-- 
cgit v1.2.3-70-g09d2


From 8f77323d6be4d4e3537d2bc2bbe815e9d578eccb Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Fri, 20 Aug 2021 00:12:42 -0400
Subject: fixed bug where link colors reset on reload

need to fix new mystery bug where any new links disappear after refreshing once but re-appear after a second refrsh
---
 src/client/util/LinkManager.ts                             | 14 +++++++-------
 .../collectionFreeForm/CollectionFreeFormLinkView.tsx      |  3 ++-
 .../collectionFreeForm/CollectionFreeFormLinksView.tsx     |  1 +
 src/client/views/linking/LinkEditor.tsx                    | 11 ++++++-----
 src/client/views/nodes/LinkDescriptionPopup.tsx            |  4 ++--
 src/client/views/pdf/AnchorMenu.tsx                        |  4 ++--
 6 files changed, 20 insertions(+), 17 deletions(-)

(limited to 'src/client/views/pdf/AnchorMenu.tsx')

diff --git a/src/client/util/LinkManager.ts b/src/client/util/LinkManager.ts
index 175de0fa5..1fc0a7593 100644
--- a/src/client/util/LinkManager.ts
+++ b/src/client/util/LinkManager.ts
@@ -99,13 +99,13 @@ export class LinkManager {
 
 
     public createLinkrelationshipLists = () => {
-        const linkRelationshipList = new List<string>();
-        const linkColorList = new List<string>();
-        Doc.UserDoc().linkRelationshipList = linkRelationshipList;
-        Doc.UserDoc().linkColorList = linkColorList;
-        console.log(Doc.UserDoc().linkRelationshipList);
-        console.log(Doc.UserDoc().linkColorList);
-        //
+        //create new lists for link relations and their associated colors if the lists don't already exist
+        if (!Doc.UserDoc().linkRelationshipList && !Doc.UserDoc().linkColorList) {
+            const linkRelationshipList = new List<string>();
+            const linkColorList = new List<string>();
+            Doc.UserDoc().linkRelationshipList = linkRelationshipList;
+            Doc.UserDoc().linkColorList = linkColorList;
+        }
     }
 
     public addLink(linkDoc: Doc, checkExists = false) {
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx
index ba67bbcef..0c44df64c 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinkView.tsx
@@ -180,7 +180,8 @@ export class CollectionFreeFormLinkView extends React.Component<CollectionFreeFo
         const linkRelationship = LinkManager.currentLink?.linkRelationship; //get string representing relationship
         const linkRelationshipList = Doc.UserDoc().linkRelationshipList as List<string>;
         const linkColorList = Doc.UserDoc().linkColorList as List<string>;
-        const strokeColor = linkColorList[linkRelationshipList.indexOf(linkRelationship)]; //access stroke color using index of the relationship in the color list
+        //access stroke color using index of the relationship in the color list (default black)
+        const strokeColor = linkRelationshipList.indexOf(linkRelationship) == -1 ? "black" : linkColorList[linkRelationshipList.indexOf(linkRelationship)];
         console.log(strokeColor);
         return !a.width || !b.width || ((!this.props.LinkDocs[0].linkDisplay) && !aActive && !bActive) ? (null) : (<>
             <path className="collectionfreeformlinkview-linkLine" style={{ opacity: this._opacity, strokeDasharray: "2 2", stroke: strokeColor }}
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
index 5e0b31754..e812064b7 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx
@@ -9,6 +9,7 @@ import "./CollectionFreeFormLinksView.scss";
 import { CollectionFreeFormLinkView } from "./CollectionFreeFormLinkView";
 import React = require("react");
 import { DocumentType } from "../../../documents/DocumentTypes";
+import { LinkManager } from "../../../util/LinkManager";
 
 @observer
 export class CollectionFreeFormLinksView extends React.Component {
diff --git a/src/client/views/linking/LinkEditor.tsx b/src/client/views/linking/LinkEditor.tsx
index 22c3c5f56..7d6f4caf2 100644
--- a/src/client/views/linking/LinkEditor.tsx
+++ b/src/client/views/linking/LinkEditor.tsx
@@ -2,7 +2,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Tooltip } from "@material-ui/core";
 import { action, computed, observable } from "mobx";
 import { observer } from "mobx-react";
-import { Doc } from "../../../fields/Doc";
+import { Doc, StrListCast } from "../../../fields/Doc";
 import { Cast, DateCast, StrCast } from "../../../fields/Types";
 import { LinkManager } from "../../util/LinkManager";
 import { undoBatch } from "../../util/UndoManager";
@@ -41,8 +41,8 @@ export class LinkEditor extends React.Component<LinkEditorProps> {
     setRelationshipValue = action((value: string) => {
         if (LinkManager.currentLink) {
             LinkManager.currentLink.linkRelationship = value;
-            const linkRelationshipList = Doc.UserDoc().linkRelationshipList as List<string>;
-            const linkColorList = Doc.UserDoc().linkColorList as List<string>;
+            const linkRelationshipList = StrListCast(Doc.UserDoc().linkRelationshipList);
+            const linkColorList = StrListCast(Doc.UserDoc().linkColorList);
             // if the relationship does not exist in the list, add it and a corresponding unique randomly generated color 
             if (linkRelationshipList && !linkRelationshipList.includes(value)) {
                 linkRelationshipList.push(value);
@@ -99,10 +99,11 @@ export class LinkEditor extends React.Component<LinkEditorProps> {
                         style={{ width: "100%" }}
                         id="input"
                         value={this.relationship}
-                        placeholder={"enter link label"}
+                        placeholder={"Enter link relationship"}
                         // color={"rgb(88, 88, 88)"}
                         onKeyDown={this.onRelationshipKey}
                         onChange={this.handleRelationshipChange}
+                        onBlur={this.onRelationshipDown}
                     ></input>
                 </div>
                 <div className="linkEditor-description-add-button"
@@ -122,7 +123,7 @@ export class LinkEditor extends React.Component<LinkEditorProps> {
                         style={{ width: "100%" }}
                         id="input"
                         value={this.description}
-                        placeholder={"enter link label"}
+                        placeholder={"Enter link description"}
                         // color={"rgb(88, 88, 88)"}
                         onKeyDown={this.onKey}
                         onChange={this.handleChange}
diff --git a/src/client/views/nodes/LinkDescriptionPopup.tsx b/src/client/views/nodes/LinkDescriptionPopup.tsx
index 30b272a9a..b62a4dd56 100644
--- a/src/client/views/nodes/LinkDescriptionPopup.tsx
+++ b/src/client/views/nodes/LinkDescriptionPopup.tsx
@@ -54,7 +54,7 @@ export class LinkDescriptionPopup extends React.Component<{}> {
             }}>
             <input className="linkDescriptionPopup-input"
                 onKeyPress={e => e.key === "Enter" && this.onDismiss(true)}
-                placeholder={"(optional) enter link label..."}
+                placeholder={"(Optional) Enter link description..."}
                 onChange={(e) => this.descriptionChanged(e)}>
             </input>
             <div className="linkDescriptionPopup-btn">
@@ -65,4 +65,4 @@ export class LinkDescriptionPopup extends React.Component<{}> {
             </div>
         </div>;
     }
-} 
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/src/client/views/pdf/AnchorMenu.tsx b/src/client/views/pdf/AnchorMenu.tsx
index 8d74b2ac4..75e3f81fb 100644
--- a/src/client/views/pdf/AnchorMenu.tsx
+++ b/src/client/views/pdf/AnchorMenu.tsx
@@ -152,12 +152,12 @@ export class AnchorMenu extends AntimodeMenu<AntimodeMenuProps> {
                     </button>
                 </Tooltip>,
                 //NOTE: link popup is currently in progress
-                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document or URL"}</div>}>
+                <Tooltip key="link" title={<div className="dash-tooltip">{"Link selected text to document"}</div>}>
                     <button className="antimodeMenu-button link" onPointerDown={this.toggleLinkPopup} style={{}}>
                         <FontAwesomeIcon icon="link" size="lg" />
                     </button>
                 </Tooltip>,
-                <LinkPopup showPopup={this._showLinkPopup} linkFrom={this.onMakeAnchor}/>
+                <LinkPopup showPopup={this._showLinkPopup} linkFrom={this.onMakeAnchor} />
             ] : [
                 <Tooltip key="trash" title={<div className="dash-tooltip">{"Remove Link Anchor"}</div>}>
                     <button className="antimodeMenu-button" onPointerDown={this.Delete}>
-- 
cgit v1.2.3-70-g09d2

