fixed equation box resizing to stay in place. fixedlightbox to have a black foreground color so equations can be seen. fixed function plots to translate more of the math syntax

4 files changed, 15 insertions, 7 deletions

diff --git a/src/client/views/LightboxView.scss b/src/client/views/LightboxView.scss
index 9a9b8a437..6da5c0338 100644
--- a/src/client/views/LightboxView.scss
+++ b/src/client/views/LightboxView.scss
@@ -67,6 +67,7 @@
     z-index: 1000;
     .lightboxView-contents {
         position: absolute;
+        color: black;
     }
     .lightboxView-navBtn-frame {
         position: absolute;
diff --git a/src/client/views/LightboxView.tsx b/src/client/views/LightboxView.tsx
index 1f0b8e387..be7c22c9f 100644
--- a/src/client/views/LightboxView.tsx
+++ b/src/client/views/LightboxView.tsx
@@ -244,7 +244,6 @@ export class LightboxView extends ObservableReactComponent<LightboxViewProps> {
                         height: this.lightboxHeight(),
                         clipPath: `path('${Doc.UserDoc().renderStyle === 'comic' ? wavyBorderPath(this.lightboxWidth(), this.lightboxHeight()) : undefined}')`,
                         background: SettingsManager.userBackgroundColor,
-                        color: SettingsManager.userColor,
                     }}>
                     <GestureOverlay isActive={true}>
                         <DocumentView
diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index 8362db37a..c43f89be1 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -81,7 +81,7 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
                 backgroundColor: 'white',
             });
             const link = DocUtils.MakeLink(this.Document, graph, { link_relationship: 'function', link_description: 'input' });
-            //this._props.addDocument?.(graph);
+            this._props.addDocument?.(graph);
             link && this._props.addDocument?.(link);
             e.stopPropagation();
         }
@@ -96,11 +96,10 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
             if (this.layoutDoc._nativeWidth) {
                 // if equation has been scaled then editing the expression must also edit the native dimensions to keep the aspect ratio
                 const prevNwidth = NumCast(this.layoutDoc._nativeWidth);
-                const prevNheight = NumCast(this.layoutDoc._nativeHeight);
-                this.layoutDoc._nativeWidth = Math.max(35, Number(style.width.replace('px', '')));
-                this.layoutDoc._nativeHeight = Math.max(25, Number(style.height.replace('px', '')));
+                const newNwidth = (this.layoutDoc._nativeWidth = Math.max(35, Number(style.width.replace('px', ''))));
+                const newNheight = (this.layoutDoc._nativeHeight = Math.max(25, Number(style.height.replace('px', ''))));
                 this.layoutDoc._width = (NumCast(this.layoutDoc._width) * NumCast(this.layoutDoc._nativeWidth)) / prevNwidth;
-                this.layoutDoc._height = (NumCast(this.layoutDoc._height) * NumCast(this.layoutDoc._nativeHeight)) / prevNheight;
+                this.layoutDoc._height = (NumCast(this.layoutDoc._width) * newNheight) / newNwidth;
             } else {
                 this.layoutDoc._width = Math.max(35, Number(style.width.replace('px', '')));
                 this.layoutDoc._height = Math.max(25, Number(style.height.replace('px', '')));
diff --git a/src/client/views/nodes/FunctionPlotBox.tsx b/src/client/views/nodes/FunctionPlotBox.tsx
index 67445e552..a86bdbd79 100644
--- a/src/client/views/nodes/FunctionPlotBox.tsx
+++ b/src/client/views/nodes/FunctionPlotBox.tsx
@@ -51,7 +51,16 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
             .map(d => LinkManager.getOppositeAnchor(d, this.Document))
             .filter(d => d)
             .map(d => d!);
-        return links.concat(DocListCast(this.dataDoc[this.fieldKey])).map(doc => StrCast(doc.text, 'x^2').replace(/\\frac\{(.*)\}\{(.*)\}/, '($1/$2)'));
+        const funcs = links.concat(DocListCast(this.dataDoc[this.fieldKey])).map(doc =>
+            StrCast(doc.text, 'x^2')
+                .replace(/\\sqrt/g, 'sqrt')
+                .replace(/\\frac\{(.*)\}\{(.*)\}/g, '($1/$2)')
+                .replace(/\\left/g, '')
+                .replace(/\\right/g, '')
+                .replace(/\{/g, '')
+                .replace(/\}/g, '')
+        );
+        return funcs;
     }
     createGraph = (ele?: HTMLDivElement) => {
         this._plotEle = ele || this._plotEle;