From 956628a22c2d8ae21eb76c70f8f0a5a4edc9ae75 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 10 Feb 2022 17:12:19 -0500
Subject: switched scripts to use a cache to avoid recompiling. simplified some
 things with documentView and zooming to avoid invalidations.

---
 src/client/views/nodes/DocumentLinksButton.tsx | 27 +++++++++++++++-----------
 1 file changed, 16 insertions(+), 11 deletions(-)

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

diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index 93cd02d93..eb5571d16 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -20,6 +20,7 @@ import { DocumentView } from "./DocumentView";
 import { LinkDescriptionPopup } from "./LinkDescriptionPopup";
 import { TaskCompletionBox } from "./TaskCompletedBox";
 import React = require("react");
+import { Transform } from "../../util/Transform";
 
 const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
@@ -31,6 +32,8 @@ interface DocumentLinksButtonProps {
     AlwaysOn?: boolean;
     InMenu?: boolean;
     StartLink?: boolean; //whether the link HAS been started (i.e. now needs to be completed)
+    ScreenToLocalTransform: () => Transform;
+    ContentScaling?: () => number;
 }
 @observer
 export class DocumentLinksButton extends React.Component<DocumentLinksButtonProps, {}> {
@@ -302,16 +305,18 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         const title = this.props.InMenu ? menuTitle : buttonTitle;
 
         //render circular tooltip if it isn't set to invisible and show the number of doc links the node has, and render inner-menu link button for starting/stopping links if currently in menu
-        return !Array.from(this.filteredLinks).length && !this.props.AlwaysOn ? (null) :
-            this.props.InMenu && (DocumentLinksButton.StartLink || this.props.StartLink) ?
-                <Tooltip title={<div className="dash-tooltip">{title}</div>}>
-                    {this.linkButtonInner}
-                </Tooltip>
-                :
-                !DocumentLinksButton.LinkEditorDocView && !this.props.InMenu ?
-                    <Tooltip title={<div className="dash-tooltip">{title}</div>}>
-                        {this.linkButtonInner}
-                    </Tooltip>
-                    : this.linkButtonInner;
+        return (!Array.from(this.filteredLinks).length && !this.props.AlwaysOn) || !this.props.ScreenToLocalTransform ? (null) :
+            <div className="documentLinksButton-wrapper" style={{
+                //transform: `scale(${Math.min(1, this.props.ScreenToLocalTransform().scale(this.props.ContentScaling?.() || 1).Scale)})`
+            }}>
+                {
+                    (this.props.InMenu && (DocumentLinksButton.StartLink || this.props.StartLink)) ||
+                        (!DocumentLinksButton.LinkEditorDocView && !this.props.InMenu) ?
+                        <Tooltip title={<div className="dash-tooltip">{title}</div>}>
+                            {this.linkButtonInner}
+                        </Tooltip>
+                        : this.linkButtonInner
+                }
+            </div>;
     }
 }
-- 
cgit v1.2.3-70-g09d2


From 3e728c21ba578843ebd25294f336f0bf6601b75f Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 22 Feb 2022 14:00:29 -0500
Subject: fixed switching tabs to immediately render the title of the tab as
 content to provide feedback that something is happening.  changed server to
 only set caching for images. fixed warnings/errors.

---
 src/client/util/CurrentUserUtils.ts                |  2 +-
 src/client/views/collections/CollectionSubView.tsx |  2 +-
 .../collectionFreeForm/CollectionFreeFormView.tsx  | 68 ++++++++++++----------
 src/client/views/nodes/DocumentLinksButton.tsx     |  7 +--
 src/client/views/nodes/DocumentView.tsx            |  1 -
 src/server/server_Initialization.ts                |  6 +-
 6 files changed, 43 insertions(+), 43 deletions(-)

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

diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index c00fd5bc8..fd4b01753 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -1108,7 +1108,7 @@ export class CurrentUserUtils {
                             break;
                     }
                     tools.map(({ title, toolTip, icon, btnType, numBtnType, numBtnMax, numBtnMin, click, script, width, list, ignoreClick, switchToggle }) => {
-                        var computed = click ? ComputedField.MakeFunction(click) as any : "transparent";
+                        const computed = click ? ComputedField.MakeFunction(click) as any : "transparent";
                         menuDocList.push(Docs.Create.FontIconDocument({
                             _nativeWidth: width ? width : 25,
                             _nativeHeight: 25,
diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx
index fc1bcb8b9..4bb14273a 100644
--- a/src/client/views/collections/CollectionSubView.tsx
+++ b/src/client/views/collections/CollectionSubView.tsx
@@ -33,7 +33,7 @@ export function CollectionSubView<T, X>(schemaCtor: (doc: Doc) => T, moreProps?:
         protected _mainCont?: HTMLDivElement;
         @observable _focusFilters: Opt<string[]>; // docFilters that are overridden when previewing a link to an anchor which has docFilters set on it
         @observable _focusRangeFilters: Opt<string[]>; // docRangeFilters that are overridden when previewing a link to an anchor which has docRangeFilters set on it
-        protected createDashEventsTarget = (ele: HTMLDivElement) => { //used for stacking and masonry view
+        protected createDashEventsTarget = (ele: HTMLDivElement | null) => { //used for stacking and masonry view
             this.dropDisposer?.();
             this.gestureDisposer?.();
             this._multiTouchDisposer?.();
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 689b6a1b6..3443f33e1 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -109,6 +109,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
     @observable _viewTransition: number = 0;  // sets the pan/zoom transform ease time- used by nudge(), focus() etc to smoothly zoom/pan.  set to 0 to use document's transition time or default of 0
     @observable _hLines: number[] | undefined;
     @observable _vLines: number[] | undefined;
+    @observable _firstRender = true; // this turns off rendering of the collection's content so that there's instant feedback when a tab is switched of what content will be shown.
     @observable _pullCoords: number[] = [0, 0];
     @observable _pullDirection: string = "";
     @observable _showAnimTimeline = false;
@@ -163,7 +164,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
         this.layoutDoc._panY = vals.bounds.cy;
         this.layoutDoc._viewScale = vals.scale;
     }
-    freeformData = (force?: boolean) => this.fitToContent || force ? this.fitToContentVals : undefined;
+    freeformData = (force?: boolean) => !this._firstRender && (this.fitToContent || force) ? this.fitToContentVals : undefined;
     reverseNativeScaling = () => this.fitToContent ? true : false;
     panX = () => this.freeformData()?.bounds.cx ?? NumCast(this.Document._panX);
     panY = () => this.freeformData()?.bounds.cy ?? NumCast(this.Document._panY);
@@ -1373,35 +1374,38 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
     componentDidMount() {
         super.componentDidMount?.();
         this.props.setContentView?.(this);
-        this._disposers.layoutComputation = reaction(() => this.doLayoutComputation,
-            (elements) => this._layoutElements = elements || [],
-            { fireImmediately: true, name: "doLayout" });
-
-        this._marqueeRef.current?.addEventListener("dashDragAutoScroll", this.onDragAutoScroll as any);
-
-        this._disposers.groupBounds = reaction(() => {
-            if (this.props.Document._isGroup && this.childDocs.length === this.childDocList?.length) {
-                const clist = this.childDocs.map(cd => ({ x: NumCast(cd.x), y: NumCast(cd.y), width: cd[WidthSym](), height: cd[HeightSym]() }));
-                return aggregateBounds(clist, NumCast(this.layoutDoc._xPadding), NumCast(this.layoutDoc._yPadding));
-            }
-            return undefined;
-        },
-            (cbounds) => {
-                if (cbounds) {
-                    const c = [NumCast(this.layoutDoc.x) + this.layoutDoc[WidthSym]() / 2, NumCast(this.layoutDoc.y) + this.layoutDoc[HeightSym]() / 2];
-                    const p = [NumCast(this.layoutDoc._panX), NumCast(this.layoutDoc._panY)];
-                    const pbounds = {
-                        x: (cbounds.x - p[0]) * this.zoomScaling() + c[0], y: (cbounds.y - p[1]) * this.zoomScaling() + c[1],
-                        r: (cbounds.r - p[0]) * this.zoomScaling() + c[0], b: (cbounds.b - p[1]) * this.zoomScaling() + c[1]
-                    };
-                    this.layoutDoc._width = (pbounds.r - pbounds.x);
-                    this.layoutDoc._height = (pbounds.b - pbounds.y);
-                    this.layoutDoc._panX = (cbounds.r + cbounds.x) / 2;
-                    this.layoutDoc._panY = (cbounds.b + cbounds.y) / 2;
-                    this.layoutDoc.x = pbounds.x;
-                    this.layoutDoc.y = pbounds.y;
+        setTimeout(action(() => {
+            this._firstRender = false;
+            this._disposers.layoutComputation = reaction(() => this.doLayoutComputation,
+                (elements) => this._layoutElements = elements || [],
+                { fireImmediately: true, name: "doLayout" });
+
+            this._marqueeRef.current?.addEventListener("dashDragAutoScroll", this.onDragAutoScroll as any);
+
+            this._disposers.groupBounds = reaction(() => {
+                if (this.props.Document._isGroup && this.childDocs.length === this.childDocList?.length) {
+                    const clist = this.childDocs.map(cd => ({ x: NumCast(cd.x), y: NumCast(cd.y), width: cd[WidthSym](), height: cd[HeightSym]() }));
+                    return aggregateBounds(clist, NumCast(this.layoutDoc._xPadding), NumCast(this.layoutDoc._yPadding));
                 }
-            }, { fireImmediately: true });
+                return undefined;
+            },
+                (cbounds) => {
+                    if (cbounds) {
+                        const c = [NumCast(this.layoutDoc.x) + this.layoutDoc[WidthSym]() / 2, NumCast(this.layoutDoc.y) + this.layoutDoc[HeightSym]() / 2];
+                        const p = [NumCast(this.layoutDoc._panX), NumCast(this.layoutDoc._panY)];
+                        const pbounds = {
+                            x: (cbounds.x - p[0]) * this.zoomScaling() + c[0], y: (cbounds.y - p[1]) * this.zoomScaling() + c[1],
+                            r: (cbounds.r - p[0]) * this.zoomScaling() + c[0], b: (cbounds.b - p[1]) * this.zoomScaling() + c[1]
+                        };
+                        this.layoutDoc._width = (pbounds.r - pbounds.x);
+                        this.layoutDoc._height = (pbounds.b - pbounds.y);
+                        this.layoutDoc._panX = (cbounds.r + cbounds.x) / 2;
+                        this.layoutDoc._panY = (cbounds.b + cbounds.y) / 2;
+                        this.layoutDoc.x = pbounds.x;
+                        this.layoutDoc.y = pbounds.y;
+                    }
+                }, { fireImmediately: true });
+        }));
     }
 
     componentWillUnmount() {
@@ -1566,7 +1570,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
             this._numLoaded++;
         }
         this._numLoaded < this.views.length && setTimeout(this.incrementalRender, 1);
-    })
+    });
 
     children = () => {
         this.incrementalRender();
@@ -1658,7 +1662,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
     }
 
     @computed get contentScaling() {
-        if (this.props.isAnnotationOverlay && !this.props.annotationLayerHostsContent) return 0;
+        if (this._firstRender || (this.props.isAnnotationOverlay && !this.props.annotationLayerHostsContent)) return 0;
         const nw = this.nativeWidth;
         const nh = this.nativeHeight;
         const hscale = nh ? this.props.PanelHeight() / nh : 1;
@@ -1693,7 +1697,7 @@ export class CollectionFreeFormView extends CollectionSubView<PanZoomDocument, P
                 width: `${100 / (this.contentScaling || 1)}%`,
                 height: this.isAnnotationOverlay && this.Document.scrollHeight ? this.Document.scrollHeight : `${100 / (this.contentScaling || 1)}%`// : this.isAnnotationOverlay ? (this.Document.scrollHeight ? this.Document.scrollHeight : "100%") : this.props.PanelHeight()
             }}>
-            {this.Document._freeformLOD && !this.props.isContentActive() && !this.props.isAnnotationOverlay && this.props.renderDepth > 0 ?
+            {this._firstRender || (this.Document._freeformLOD && !this.props.isContentActive() && !this.props.isAnnotationOverlay && this.props.renderDepth > 0) ?
                 this.placeholder : this.marqueeView}
             {this.props.noOverlay ? (null) : <CollectionFreeFormOverlayView elements={this.elementFunc} />}
 
diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx
index eb5571d16..7e6ca4248 100644
--- a/src/client/views/nodes/DocumentLinksButton.tsx
+++ b/src/client/views/nodes/DocumentLinksButton.tsx
@@ -32,7 +32,6 @@ interface DocumentLinksButtonProps {
     AlwaysOn?: boolean;
     InMenu?: boolean;
     StartLink?: boolean; //whether the link HAS been started (i.e. now needs to be completed)
-    ScreenToLocalTransform: () => Transform;
     ContentScaling?: () => number;
 }
 @observer
@@ -305,10 +304,8 @@ export class DocumentLinksButton extends React.Component<DocumentLinksButtonProp
         const title = this.props.InMenu ? menuTitle : buttonTitle;
 
         //render circular tooltip if it isn't set to invisible and show the number of doc links the node has, and render inner-menu link button for starting/stopping links if currently in menu
-        return (!Array.from(this.filteredLinks).length && !this.props.AlwaysOn) || !this.props.ScreenToLocalTransform ? (null) :
-            <div className="documentLinksButton-wrapper" style={{
-                //transform: `scale(${Math.min(1, this.props.ScreenToLocalTransform().scale(this.props.ContentScaling?.() || 1).Scale)})`
-            }}>
+        return (!Array.from(this.filteredLinks).length && !this.props.AlwaysOn) ? (null) :
+            <div className="documentLinksButton-wrapper" >
                 {
                     (this.props.InMenu && (DocumentLinksButton.StartLink || this.props.StartLink)) ||
                         (!DocumentLinksButton.LinkEditorDocView && !this.props.InMenu) ?
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 9450aedb5..91f2359af 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -871,7 +871,6 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
             {this.hideLinkButton || this.props.renderDepth === -1 || SnappingManager.GetIsDragging() ? (null) :
                 <DocumentLinksButton View={this.props.DocumentView()}
                     ContentScaling={this.props.ContentScaling}
-                    ScreenToLocalTransform={this.props.ScreenToLocalTransform}
                     Offset={[this.topMost ? 0 : -15, undefined, undefined, this.topMost ? 10 : -20]} />
             }
             {audioView}
diff --git a/src/server/server_Initialization.ts b/src/server/server_Initialization.ts
index 3bdc93f10..d1b9d8cf2 100644
--- a/src/server/server_Initialization.ts
+++ b/src/server/server_Initialization.ts
@@ -92,12 +92,12 @@ function buildWithMiddleware(server: express.Express) {
         passport.session(),
         (req: express.Request, res: express.Response, next: express.NextFunction) => {
             res.locals.user = req.user;
-            if (req.method == 'GET') {
+            if (req.originalUrl.endsWith(".png") && req.method === 'GET') {
                 const period = 30000;
-                res.set('Cache-control', `public, max-age=${period}`)
+                res.set('Cache-control', `public, max-age=${period}`);
             } else {
                 // for the other requests set strict no caching parameters
-                res.set('Cache-control', `no-store`)
+                res.set('Cache-control', `no-store`);
             }
             next();
         }
-- 
cgit v1.2.3-70-g09d2

