fixed making strokes able to allow followTarget click funcs to what they're linked to. Made it possible to render links to links. avoid deleting links when switching tabs/closing app.

3 files changed, 18 insertions, 7 deletions

diff --git a/src/client/views/InkingStroke.tsx b/src/client/views/InkingStroke.tsx
index ce70b5052..345309b4a 100644
--- a/src/client/views/InkingStroke.tsx
+++ b/src/client/views/InkingStroke.tsx
@@ -34,7 +34,7 @@ import { InteractionUtils } from '../util/InteractionUtils';
 import { SnappingManager } from '../util/SnappingManager';
 import { UndoManager } from '../util/UndoManager';
 import { ContextMenu } from './ContextMenu';
-import { ViewBoxBaseComponent, ViewBoxInterface } from './DocComponent';
+import { ViewBoxAnnotatableComponent, ViewBoxBaseComponent, ViewBoxInterface } from './DocComponent';
 import { Colors } from './global/globalEnums';
 import { InkControlPtHandles, InkEndPtHandles } from './InkControlPtHandles';
 import './InkStroke.scss';
@@ -46,7 +46,7 @@ import { PinProps, PresBox } from './nodes/trails';
 import { StyleProp } from './StyleProvider';
 const { default: { INK_MASK_SIZE } } = require('./global/globalCssVariables.module.scss'); // prettier-ignore
 @observer
-export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps>() implements ViewBoxInterface {
+export class InkingStroke extends ViewBoxAnnotatableComponent<FieldViewProps>() implements ViewBoxInterface {
     static readonly MaskDim = INK_MASK_SIZE; // choose a really big number to make sure mask fits over container (which in theory can be arbitrarily big)
     public static LayoutString(fieldStr: string) {
         return FieldView.LayoutString(InkingStroke, fieldStr);
@@ -87,7 +87,7 @@ export class InkingStroke extends ViewBoxBaseComponent<FieldViewProps>() impleme
         });
         if (anchor) {
             anchor.backgroundColor = 'transparent';
-            // /* addAsAnnotation &&*/ this.addDocument(anchor);
+            addAsAnnotation && this.addDocument(anchor);
             PresBox.pinDocView(anchor, { pinDocLayout: pinProps?.pinDocLayout, pinData: { ...(pinProps?.pinData ?? {}), inkable: true } }, this.Document);
             return anchor;
         }
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 6d8656888..3e8d672d6 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -50,6 +50,7 @@ import { KeyValueBox } from './KeyValueBox';
 import { LinkAnchorBox } from './LinkAnchorBox';
 import { FormattedTextBox } from './formattedText/FormattedTextBox';
 import { PresEffect, PresEffectDirection } from './trails';
+import { InkingStroke } from '../InkingStroke';
 interface Window {
     MediaRecorder: MediaRecorder;
 }
@@ -200,6 +201,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
             ((!this.disableClickScriptFunc && //
                 this.onClickHandler &&
                 !this._props.onBrowseClickScript?.() &&
+                !this.layoutDoc.layout_isSvg &&
                 this.isContentActive() !== true) ||
                 this.isContentActive() === false)
             ? 'none'
@@ -919,7 +921,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
             : this.docContents ?? (
                   <div
                       className="documentView-node"
-                      id={this.Document[Id]}
+                      id={this.Document.type !== DocumentType.LINK ? this.Document[Id] : undefined}
                       style={{
                           ...style,
                           background: this.backgroundBoxColor,
diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx
index 8ebcefb35..b3245310f 100644
--- a/src/client/views/nodes/LinkBox.tsx
+++ b/src/client/views/nodes/LinkBox.tsx
@@ -39,14 +39,16 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
         const anchor = anch?.layout_unrendered ? DocCast(anch.annotationOn) : anch;
         return DocumentManager.Instance.getDocumentView(anchor, this.DocumentView?.().containerViewPath?.().lastElement());
     };
+    _hackToSeeIfDeleted: any;
     componentWillUnmount() {
+        this._hackToSeeIfDeleted && clearTimeout(this._hackToSeeIfDeleted);
         Object.keys(this._disposers).forEach(key => this._disposers[key]());
     }
     componentDidMount() {
         this._props.setContentViewBox?.(this);
         this._disposers.deleting = reaction(
             () => !this.anchor1 || !this.anchor2,
-            empty => empty && this._props.removeDocument?.(this.Document)
+            empty => empty && (this._hackToSeeIfDeleted = setTimeout(() => this._props.removeDocument?.(this.Document), 1000))
         );
         this._disposers.dragging = reaction(
             () => ({ drag: SnappingManager.IsDragging }),
@@ -100,8 +102,10 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
             var foundParent = false;
             const getAnchor = (field: FieldResult): Element[] => {
-                const doc = DocCast(field);
+                const docField = DocCast(field);
+                const doc = docField?.layout_unrendered ? DocCast(docField.annotationOn, docField) : docField;
                 const ele = document.getElementById(doc[Id]);
+                if (ele?.className === 'linkBox-label') foundParent = true;
                 if (ele?.getBoundingClientRect().width) return [ele];
                 const eles = Array.from(document.getElementsByClassName(doc[Id])).filter(ele => ele?.getBoundingClientRect().width);
                 const annoOn = DocCast(doc.annotationOn);
@@ -124,7 +128,10 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 return null;
             }
             if (foundParent) {
-                setTimeout(action(() => (this._forceAnimate = this._forceAnimate + 1)));
+                setTimeout(
+                    action(() => (this._forceAnimate = this._forceAnimate + 0.01)),
+                    1
+                );
             }
 
             if (at || bt) setTimeout(action(() => (this._forceAnimate = this._forceAnimate + 0.01))); // this forces an update during a transition animation
@@ -171,6 +178,8 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
                         color={color}
                         labels={
                             <div
+                                id={this.Document[Id]}
+                                className={'linkBox-label'}
                                 style={{
                                     borderRadius: '8px',
                                     pointerEvents: this._props.isDocumentActive?.() ? 'all' : undefined,