From 2e0174e16abab1c603bc45bf98903a89f0cbf84b Mon Sep 17 00:00:00 2001
From: dinhanhtruong <70963346+dinhanhtruong@users.noreply.github.com>
Date: Tue, 17 Aug 2021 23:17:36 -0400
Subject: in-progress link relationship color association

created list fields for link relationships and their associated colors. Need to implement colors in front end
---
 src/client/views/linking/LinkEditor.tsx | 32 ++++++++++++++++++++++----------
 src/client/views/linking/LinkMenu.tsx   |  2 +-
 2 files changed, 23 insertions(+), 11 deletions(-)

(limited to 'src/client/views')

diff --git a/src/client/views/linking/LinkEditor.tsx b/src/client/views/linking/LinkEditor.tsx
index f74b422d3..22c3c5f56 100644
--- a/src/client/views/linking/LinkEditor.tsx
+++ b/src/client/views/linking/LinkEditor.tsx
@@ -3,11 +3,13 @@ import { Tooltip } from "@material-ui/core";
 import { action, computed, observable } from "mobx";
 import { observer } from "mobx-react";
 import { Doc } from "../../../fields/Doc";
-import { DateCast, StrCast } from "../../../fields/Types";
+import { Cast, DateCast, StrCast } from "../../../fields/Types";
 import { LinkManager } from "../../util/LinkManager";
 import { undoBatch } from "../../util/UndoManager";
 import './LinkEditor.scss';
 import React = require("react");
+import { listSpec } from "../../../fields/Schema";
+import { List } from "../../../fields/List";
 
 
 interface LinkEditorProps {
@@ -39,6 +41,16 @@ 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>;
+            // 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);
+                const randColor = "rgb(" + Math.floor(Math.random() * 255) + "," + Math.floor(Math.random() * 255) + "," + Math.floor(Math.random() * 255) + ")";
+                linkColorList.push(randColor)
+                console.log(randColor)
+                console.log("linkRelList size: " + linkRelationshipList.length);
+            }
             this.relationshipButtonColor = "rgb(62, 133, 55)";
             setTimeout(action(() => this.relationshipButtonColor = ""), 750);
             return true;
@@ -70,7 +82,7 @@ export class LinkEditor extends React.Component<LinkEditorProps> {
     }
 
     onDown = () => this.setDescripValue(this.description);
-    onRelationshipDown = () => this.setRelationshipValue(this.description);
+    onRelationshipDown = () => this.setRelationshipValue(this.relationship);
 
     @action
     handleChange = (e: React.ChangeEvent<HTMLInputElement>) => { this.description = e.target.value; }
@@ -149,35 +161,35 @@ export class LinkEditor extends React.Component<LinkEditorProps> {
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("default")}>
                         Default
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("add:left")}>
                         Always open in new left pane
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("add:right")}>
                         Always open in new right pane
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("replace:right")}>
                         Always replace right tab
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("replace:left")}>
                         Always replace left tab
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("fullScreen")}>
                         Always open full screen
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("add")}>
                         Always open in a new tab
-                        </div>
+                    </div>
                     <div className="linkEditor-followingDropdown-option"
                         onPointerDown={() => this.changeFollowBehavior("replace")}>
                         Replace Tab
-                        </div>
+                    </div>
                     {this.props.linkDoc.linksToAnnotation ?
                         <div className="linkEditor-followingDropdown-option"
                             onPointerDown={() => this.changeFollowBehavior("openExternal")}>
diff --git a/src/client/views/linking/LinkMenu.tsx b/src/client/views/linking/LinkMenu.tsx
index 6fc860447..53fe3f682 100644
--- a/src/client/views/linking/LinkMenu.tsx
+++ b/src/client/views/linking/LinkMenu.tsx
@@ -41,7 +41,7 @@ export class LinkMenu extends React.Component<Props> {
 
     /**
      * maps each link to a JSX element to be rendered
-     * @param groups LinkManager containing info of all of the links
+     * @param groups containing info of all of the links
      * @returns list of link JSX elements if there at least one linked element
      */
     renderAllGroups = (groups: Map<string, Array<Doc>>): Array<JSX.Element> => {
-- 
cgit v1.2.3-70-g09d2