From dca61505ba138eef3819b16b760ec81becf9329e Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Sat, 13 May 2023 09:55:48 -0400
Subject: changed EditableViews to support oneline and multiline.  Also added
 transformer UI to allow documents to be entered. changed transformer to write
 doc id's, not variables..  made schema view support oneline and fixed bug
 with docdecoration hader occluding things invisibly.   updated web pages to
 be zoomable and for its anchors to update web page and scroll location
 properly.  made autolinkanchor directly go to target on click.

---
 src/client/views/nodes/DocumentIcon.tsx | 56 ++++++++++++++++++++++-----------
 1 file changed, 37 insertions(+), 19 deletions(-)

(limited to 'src/client/views/nodes/DocumentIcon.tsx')

diff --git a/src/client/views/nodes/DocumentIcon.tsx b/src/client/views/nodes/DocumentIcon.tsx
index 56de2d1fc..6e2ed72b8 100644
--- a/src/client/views/nodes/DocumentIcon.tsx
+++ b/src/client/views/nodes/DocumentIcon.tsx
@@ -1,23 +1,39 @@
-
-import { observer } from "mobx-react";
-import * as React from "react";
-import { DocumentView } from "./DocumentView";
-import { DocumentManager } from "../../util/DocumentManager";
-import { Transformer, ts } from "../../util/Scripting";
-import { Field } from "../../../fields/Doc";
+import { observer } from 'mobx-react';
+import * as React from 'react';
+import { DocumentView } from './DocumentView';
+import { DocumentManager } from '../../util/DocumentManager';
+import { Transformer, ts } from '../../util/Scripting';
+import { Field } from '../../../fields/Doc';
+import { Tooltip } from '@material-ui/core';
+import { action, observable } from 'mobx';
+import { Id } from '../../../fields/FieldSymbols';
+import { factory } from 'typescript';
+import { LightboxView } from '../LightboxView';
 
 @observer
-export class DocumentIcon extends React.Component<{ view: DocumentView, index: number }> {
+export class DocumentIcon extends React.Component<{ view: DocumentView; index: number }> {
+    @observable _hovered = false;
+    static get DocViews() {
+        return LightboxView.LightboxDoc ? DocumentManager.Instance.DocumentViews.filter(v => LightboxView.IsLightboxDocView(v.props.docViewPath())) : DocumentManager.Instance.DocumentViews;
+    }
     render() {
         const view = this.props.view;
         const { left, top, right, bottom } = view.getBounds() || { left: 0, top: 0, right: 0, bottom: 0 };
 
         return (
-            <div className="documentIcon-outerDiv" style={{
-                position: "absolute",
-                transform: `translate(${(left + right) / 2}px, ${top}px)`,
-            }}>
-                <p>d{this.props.index}</p>
+            <div
+                className="documentIcon-outerDiv"
+                onPointerEnter={action(e => (this._hovered = true))}
+                onPointerLeave={action(e => (this._hovered = false))}
+                style={{
+                    pointerEvents: 'all',
+                    opacity: this._hovered ? 0.3 : 1,
+                    position: 'absolute',
+                    transform: `translate(${(left + right) / 2}px, ${top}px)`,
+                }}>
+                <Tooltip title={<>{this.props.view.rootDoc.title}</>}>
+                    <p>d{this.props.index}</p>
+                </Tooltip>
             </div>
         );
     }
@@ -41,7 +57,9 @@ export class DocumentIconContainer extends React.Component {
                                 const match = node.text.match(/d([0-9]+)/);
                                 if (match) {
                                     const m = parseInt(match[1]);
+                                    const doc = DocumentIcon.DocViews[m].rootDoc;
                                     usedDocuments.add(m);
+                                    return factory.createIdentifier(`idToDoc("${doc[Id]}")`);
                                 }
                             }
                         }
@@ -52,14 +70,14 @@ export class DocumentIconContainer extends React.Component {
                 };
             },
             getVars() {
-                const docs = Array.from(DocumentManager.Instance.DocumentViews);
+                const docs = DocumentIcon.DocViews;
                 const capturedVariables: { [name: string]: Field } = {};
-                usedDocuments.forEach(index => capturedVariables[`d${index}`] = docs[index].props.Document);
-                return { capturedVariables };
-            }
+                usedDocuments.forEach(index => (capturedVariables[`d${index}`] = docs.length > index ? docs[index].props.Document : `d${index}`));
+                return capturedVariables;
+            },
         };
     }
     render() {
-        return Array.from(DocumentManager.Instance.DocumentViews).map((dv, i) => <DocumentIcon key={i} index={i} view={dv} />);
+        return DocumentIcon.DocViews.map((dv, i) => <DocumentIcon key={i} index={i} view={dv} />);
     }
-}
\ No newline at end of file
+}
-- 
cgit v1.2.3-70-g09d2

