From cbf88ae3466e17fef57c7d63cc72ee42b75ccce6 Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Thu, 28 Mar 2019 10:36:03 -0400
Subject: cleaned up

---
 .../views/collections/CollectionFreeFormView.scss  | 17 ++++++++++
 .../views/collections/CollectionFreeFormView.tsx   | 39 +++++++++-------------
 2 files changed, 32 insertions(+), 24 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionFreeFormView.scss b/src/client/views/collections/CollectionFreeFormView.scss
index bdc597a25..2dd345b6f 100644
--- a/src/client/views/collections/CollectionFreeFormView.scss
+++ b/src/client/views/collections/CollectionFreeFormView.scss
@@ -1,5 +1,22 @@
 @import "../global_variables";
 
+.collectionfreeformview-linkLine {
+    stroke: black;
+    stroke-width: 3;
+    transform: translate(10000px,10000px)
+}
+.collectionfreeformview-svgContainer{
+  transform: translate(-10000px,-10000px);
+  position: absolute;
+  width: 20000px; 
+  height: 20000px;
+}
+.collectionfreeformview-svgCanvas{
+  transform: translate(-10000px,-10000px);
+  position: absolute;
+  width: 20000px; 
+  height: 20000px;
+}
 .collectionfreeformview-container {
   .collectionfreeformview > .jsx-parser {
     position: absolute;
diff --git a/src/client/views/collections/CollectionFreeFormView.tsx b/src/client/views/collections/CollectionFreeFormView.tsx
index d75c53b7e..cba1110a1 100644
--- a/src/client/views/collections/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/CollectionFreeFormView.tsx
@@ -424,7 +424,7 @@ export class LinksView extends React.Component<CollectionViewProps> {
         super(props);
     }
 
-    @observable _pairs: { a: DocumentView, b: DocumentView }[] = [];
+    @observable _pairs: { a: Document, b: Document }[] = [];
 
     findPairs() {
         return DocumentManager.Instance.DocumentViews.filter(dv => dv.props.ContainingCollectionView && dv.props.ContainingCollectionView.props.Document === this.props.Document).reduce((pairs, dv) => {
@@ -435,44 +435,35 @@ export class LinksView extends React.Component<CollectionViewProps> {
                         let linkToDoc = link.GetT(KeyStore.LinkedToDocs, Document);
                         if (linkToDoc && linkToDoc != FieldWaiting) {
                             DocumentManager.Instance.getDocumentViews(linkToDoc).map(docView1 =>
-                                pairs.push({ a: dv, b: docView1 })
+                                pairs.push({ a: dv.props.Document, b: docView1.props.Document })
                             )
                         }
                     }
                     return pairs;
-                }, [] as { a: DocumentView, b: DocumentView }[]));
+                }, [] as { a: Document, b: Document }[]));
             }
             return pairs;
-        }, [] as { a: DocumentView, b: DocumentView }[]);
+        }, [] as { a: Document, b: Document }[]);
     }
     componentDidMount() {
-        reaction(() => this.findPairs()
-            , (pairs) => runInAction(() => this._pairs = pairs));
+        reaction(() => this.findPairs(), (pairs) => runInAction(() => this._pairs = pairs));
     }
 
     render() {
         if (!this._pairs.length)
             return (null);
-        return <div>
+        return <svg className="collectionfreeformview-svgCanvas">
             {this._pairs.map(pair => {
-                let doc1 = pair.a.props.Document;
-                let doc2 = pair.b.props.Document;
-                let x1 = doc1.GetNumber(KeyStore.X, 0) + doc1.GetNumber(KeyStore.Width, 0) / 2;
-                let y1 = doc1.GetNumber(KeyStore.Y, 0) + doc1.GetNumber(KeyStore.Height, 0) / 2;
-                let x2 = doc2.GetNumber(KeyStore.X, 0) + doc2.GetNumber(KeyStore.Width, 0) / 2;
-                let y2 = doc2.GetNumber(KeyStore.Y, 0) + doc2.GetNumber(KeyStore.Height, 0) / 2;
-                let lx = Math.min(x1, x2);
-                let ly = Math.min(y1, y2);
-                let w = Math.max(x1, x2) - lx;
-                let h = Math.max(y1, y2) - ly;
-                let unflipped = (x1 == lx && y1 == ly) || (x2 == lx && y2 == ly);
+                let x1 = pair.a.GetNumber(KeyStore.X, 0) + pair.a.GetNumber(KeyStore.Width, 0) / 2;
+                let y1 = pair.a.GetNumber(KeyStore.Y, 0) + pair.a.GetNumber(KeyStore.Height, 0) / 2;
+                let x2 = pair.b.GetNumber(KeyStore.X, 0) + pair.b.GetNumber(KeyStore.Width, 0) / 2;
+                let y2 = pair.b.GetNumber(KeyStore.Y, 0) + pair.b.GetNumber(KeyStore.Height, 0) / 2;
                 return (
-                    <div key={Utils.GenerateGuid()} style={{ width: w, height: h, transform: `translate(${lx}px, ${ly}px)`, position: "absolute" }}>
-                        <svg width="5000" height="5000">
-                            <line x1="0" x2={`${w}`} y1={`${unflipped ? 0 : h}`} y2={`${unflipped ? h : 0}`} width="4" style={{ stroke: "black", strokeWidth: "5" }}  ></line>
-                        </svg>
-                    </div>);
+                    <line key={Utils.GenerateGuid()} className="collectionfreeformview-linkLine"
+                        x1={`${x1}`} y1={`${y1}`}
+                        x2={`${x2}`} y2={`${y2}`} />
+                )
             })}
-        </div>
+        </svg>
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2