From 192e23a2ae335a5f0de361eed9a24a5d08547217 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Wed, 7 Oct 2020 17:49:20 -0400
Subject: fixed undoing changes to a textbox's fontsize/family.  changed
 auto-page ref syntax to start with ':'.   fixed making text menu appear when
 clicking on caption & other text boxes.

---
 src/client/views/collections/CollectionMenu.tsx    | 45 +++++++++++-----------
 .../views/nodes/formattedText/FormattedTextBox.tsx |  5 +--
 .../views/nodes/formattedText/RichTextMenu.tsx     | 45 ++++++++++++----------
 .../views/nodes/formattedText/RichTextRules.ts     |  6 +--
 4 files changed, 50 insertions(+), 51 deletions(-)

(limited to 'src')

diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx
index 09ff3bb0c..4bdb233c9 100644
--- a/src/client/views/collections/CollectionMenu.tsx
+++ b/src/client/views/collections/CollectionMenu.tsx
@@ -529,12 +529,7 @@ export class CollectionFreeFormViewChrome extends React.Component<CollectionMenu
     }
     @computed get selectedDoc() { return this.selectedDocumentView?.rootDoc; }
     @computed get isText() {
-        if (this.selectedDoc) {
-            const layoutField = Doc.LayoutField(this.selectedDoc);
-            const layoutStr = this.selectedDocumentView?.props.LayoutTemplateString || StrCast(layoutField);
-            return (document.activeElement as any)?.className.includes("ProseMirror") || layoutStr.includes("FormattedText") || StrCast((layoutField as Doc)?.layout).includes("FormattedText");
-        }
-        else return false;
+        return this.selectedDoc?.type === DocumentType.RTF || RichTextMenu.Instance?.view ? true : false;
     }
 
     @undoBatch
@@ -843,22 +838,26 @@ export class CollectionFreeFormViewChrome extends React.Component<CollectionMenu
     render() {
         return !this.props.docView.layoutDoc ? (null) :
             <div className="collectionFreeFormMenu-cont">
-                {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? <Tooltip key="back" title={<div className="dash-tooltip">Back Frame</div>} placement="bottom">
-                    <div className="backKeyframe" onClick={this.prevKeyframe}>
-                        <FontAwesomeIcon icon={"caret-left"} size={"lg"} />
-                    </div>
-                </Tooltip> : null}
-                {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? <Tooltip key="num" title={<div className="dash-tooltip">Toggle View All</div>} placement="bottom">
-                    <div className="numKeyframe" style={{ color: this.document.editing ? "white" : "black", backgroundColor: this.document.editing ? "#5B9FDD" : "#AEDDF8" }}
-                        onClick={action(() => this.document.editing = !this.document.editing)} >
-                        {NumCast(this.document._currentFrame)}
-                    </div>
-                </Tooltip> : null}
-                {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? <Tooltip key="fwd" title={<div className="dash-tooltip">Forward Frame</div>} placement="bottom">
-                    <div className="fwdKeyframe" onClick={this.nextKeyframe}>
-                        <FontAwesomeIcon icon={"caret-right"} size={"lg"} />
-                    </div>
-                </Tooltip> : null}
+                {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ?
+                    <>
+                        <Tooltip key="back" title={<div className="dash-tooltip">Back Frame</div>} placement="bottom">
+                            <div className="backKeyframe" onClick={this.prevKeyframe}>
+                                <FontAwesomeIcon icon={"caret-left"} size={"lg"} />
+                            </div>
+                        </Tooltip>
+                        <Tooltip key="num" title={<div className="dash-tooltip">Toggle View All</div>} placement="bottom">
+                            <div className="numKeyframe" style={{ color: this.document.editing ? "white" : "black", backgroundColor: this.document.editing ? "#5B9FDD" : "#AEDDF8" }}
+                                onClick={action(() => this.document.editing = !this.document.editing)} >
+                                {NumCast(this.document._currentFrame)}
+                            </div>
+                        </Tooltip>
+                        <Tooltip key="fwd" title={<div className="dash-tooltip">Forward Frame</div>} placement="bottom">
+                            <div className="fwdKeyframe" onClick={this.nextKeyframe}>
+                                <FontAwesomeIcon icon={"caret-right"} size={"lg"} />
+                            </div>
+                        </Tooltip>
+                    </>
+                    : null}
 
                 {!this.props.isOverlay || this.document.type !== DocumentType.WEB || this.isText || this.props.isDoc ? (null) :
                     this.urlEditor
@@ -872,7 +871,7 @@ export class CollectionFreeFormViewChrome extends React.Component<CollectionMenu
                     </> :
                     (null)
                 }
-                {this.isText ? <RichTextMenu /> : null}
+                {<div style={{ display: !this.isText ? "none" : undefined }}><RichTextMenu /></div>}
             </div>;
     }
 }
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 0fccbd8ef..c6bd0cb81 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -1321,6 +1321,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             if (coords && coords.left > x && coords.left < x + RichTextMenu.Instance.width && coords.top > y && coords.top < y + RichTextMenu.Instance.height + 50) {
                 y = Math.min(bounds.bottom, window.innerHeight - RichTextMenu.Instance.height);
             }
+            this._editorView && RichTextMenu.Instance?.updateMenu(this._editorView, undefined, this.props);
             setTimeout(() => window.document.activeElement === this.ProseRef?.children[0] && RichTextMenu.Instance.jumpTo(x, y), 250);
         }
     }
@@ -1557,9 +1558,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
             <div className="formattedTextBox-sidebar-handle"
                 style={{ left: `max(0px, calc(100% - ${this.sidebarWidthPercent} ${this.sidebarWidth() ? "- 5px" : "- 10px"}))`, background: annotated ? "lightBlue" : undefined }}
                 onPointerDown={this.sidebarDown}
-                onClick={e => {
-                    console.log(e);
-                }}
             />;
     }
 
@@ -1608,7 +1606,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
         const scale = this.props.hideOnLeave ? 1 : this.props.ContentScaling() * NumCast(this.layoutDoc._viewScale, 1);
         const rounded = StrCast(this.layoutDoc.borderRounding) === "100%" ? "-rounded" : "";
         const interactive = (Doc.GetSelectedTool() === InkTool.None || SnappingManager.GetIsDragging()) && !this.layoutDoc._isBackground;
-        selected && setTimeout(() => this._editorView && RichTextMenu.Instance?.updateMenu(this._editorView, undefined, this.props)); // need to make sure that we update a text box that is selected after updating the one that was deselected
         if (!selected && FormattedTextBoxComment.textBox === this) { FormattedTextBoxComment.Hide(); }
         const minimal = this.props.ignoreAutoHeight;
         const margins = NumCast(this.layoutDoc._yMargin, this.props.yMargin || 0);
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index 68239a8f1..d492b561b 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -32,7 +32,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     static Instance: RichTextMenu;
     public overMenu: boolean = false; // kind of hacky way to prevent selects not being selectable
 
-    public view?: EditorView;
+    @observable public view?: EditorView;
     public editorProps: FieldViewProps & FormattedTextBoxProps | undefined;
 
     public _brushMap: Map<string, Set<Mark>> = new Map();
@@ -154,7 +154,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
 
     @action
     public updateMenu(view: EditorView, lastState: EditorState | undefined, props: any) {
-        if (!view || !(view as any).TextView?.props.isSelected(true) || !view.hasFocus()) {
+        if (!view || !view.hasFocus()) {
             return;
         }
         this.view = view;
@@ -366,7 +366,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         );
     }
 
-    createMarksDropdown(activeOption: string, options: { mark: Mark | null, title: string, label: string, command: (mark: Mark, view: EditorView) => void, hidden?: boolean, style?: {} }[], key: string, setter: (val: string) => {}): JSX.Element {
+    createMarksDropdown(activeOption: string, options: { mark: Mark | null, title: string, label: string, command: (mark: Mark, view: EditorView) => void, hidden?: boolean, style?: {} }[], key: string, setter: (val: string) => void): JSX.Element {
         const items = options.map(({ title, label, hidden, style }) => {
             if (hidden) {
                 return <option value={label} title={title} key={label} style={style ? style : {}} hidden>{label}</option>;
@@ -378,19 +378,22 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         function onChange(e: React.ChangeEvent<HTMLSelectElement>) {
             e.stopPropagation();
             e.preventDefault();
-            self.TextView.endUndoTypingBatch();
-            options.forEach(({ label, mark, command }) => {
-                if (e.target.value === label && mark) {
-                    if (!self.TextView.props.isSelected(true)) {
-                        switch (mark.type) {
-                            case schema.marks.pFontFamily: setter(Doc.UserDoc().fontFamily = mark.attrs.family); break;
-                            case schema.marks.pFontSize: setter(Doc.UserDoc().fontSize = mark.attrs.fontSize.toString() + "px"); break;
+            self.TextView?.endUndoTypingBatch();
+            UndoManager.RunInBatch(() => {
+                options.forEach(({ label, mark, command }) => {
+                    if (e.target.value === label && mark) {
+                        if (!self.TextView?.props.isSelected(true)) {
+                            switch (mark.type) {
+                                case schema.marks.pFontFamily: setter(Doc.UserDoc().fontFamily = mark.attrs.family); break;
+                                case schema.marks.pFontSize: setter(Doc.UserDoc().fontSize = mark.attrs.fontSize.toString() + "px"); break;
+                            }
                         }
+                        else self.view && mark && command(mark, self.view);
                     }
-                    else UndoManager.RunInBatch(() => self.view && mark && command(mark, self.view), "text mark dropdown");
-                }
-            });
+                });
+            }, "text mark dropdown");
         }
+
         return <Tooltip key={key} title={<div className="dash-tooltip">{key}</div>} placement="bottom">
             <select onChange={onChange} value={activeOption}>{items}</select>
         </Tooltip>;
@@ -424,9 +427,6 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     }
 
     changeFontSize = (mark: Mark, view: EditorView) => {
-        if ((this.view?.state.selection.$from.pos || 0) < 2) {
-            this.TextView.layoutDoc._fontSize = mark.attrs.fontSize === Number(mark.attrs.fontSize) ? `${mark.attrs.fontSize}pt` : mark.attrs.fontSize;
-        }
         const fmark = view.state.schema.marks.pFontSize.create({ fontSize: mark.attrs.fontSize });
         this.setMark(fmark, view.state, (tx: any) => view.dispatch(tx.addStoredMark(fmark)), true);
         view.focus();
@@ -434,9 +434,6 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     }
 
     changeFontFamily = (mark: Mark, view: EditorView) => {
-        if ((this.view?.state.selection.$from.pos || 0) < 2) {
-            this.TextView.layoutDoc._fontFamily = mark.attrs.family;
-        }
         const fmark = view.state.schema.marks.pFontFamily.create({ family: mark.attrs.family });
         this.setMark(fmark, view.state, (tx: any) => view.dispatch(tx.addStoredMark(fmark)), true);
         view.focus();
@@ -984,8 +981,14 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
             {this.collapsed ? this.getDragger() : (null)}
             <div key="row 2" style={{ display: this.collapsed ? "none" : undefined }}>
                 <div className="richTextMenu-divider" key="divider 3" />,
-                {[this.createMarksDropdown(this.activeFontSize, this.fontSizeOptions, "font size", action((val: string) => this.activeFontSize = val)),
-                this.createMarksDropdown(this.activeFontFamily, this.fontFamilyOptions, "font family", action((val: string) => this.activeFontFamily = val)),
+                {[this.createMarksDropdown(this.activeFontSize, this.fontSizeOptions, "font size", action((val: string) => {
+                    this.activeFontSize = val;
+                    SelectionManager.SelectedDocuments().map(dv => dv.props.Document._fontSize = val);
+                })),
+                this.createMarksDropdown(this.activeFontFamily, this.fontFamilyOptions, "font family", action((val: string) => {
+                    this.activeFontFamily = val;
+                    SelectionManager.SelectedDocuments().map(dv => dv.props.Document._fontFamily = val);
+                })),
                 <div className="richTextMenu-divider" key="divider 4" />,
                 this.createNodesDropdown(this.activeListType, this.listTypeOptions, "list type", () => ({})),
                 this.createButton("sort-amount-down", "Summarize", undefined, this.insertSummarizer),
diff --git a/src/client/views/nodes/formattedText/RichTextRules.ts b/src/client/views/nodes/formattedText/RichTextRules.ts
index 72b91c955..99334b6db 100644
--- a/src/client/views/nodes/formattedText/RichTextRules.ts
+++ b/src/client/views/nodes/formattedText/RichTextRules.ts
@@ -267,11 +267,11 @@ export class RichTextRules {
             // [[fieldKey]] => show field   
             // [[fieldKey:Doc]] => show field of doc
             new InputRule(
-                new RegExp(/\[\[([a-zA-Z_@\? \-0-9]*)(=[a-zA-Z_@\? /\-0-9]*)?(:[a-zA-Z_@\.\? \-0-9]+)?\]\]$/),
+                new RegExp(/\[\[([a-zA-Z_\? \-0-9]*)(=[a-zA-Z_@\? /\-0-9]*)?(:[a-zA-Z_@:\.\? \-0-9]+)?\]\]$/),
                 (state, match, start, end) => {
                     const fieldKey = match[1];
-                    const rawdocid = match[3]?.substring(1);
-                    const docid = rawdocid ? (!rawdocid.includes("@") ? normalizeEmail(Doc.CurrentUserEmail) + "@" + rawdocid : rawdocid) : undefined;
+                    const rawdocid = match[3];
+                    const docid = rawdocid ? normalizeEmail((!rawdocid.includes("@") ? Doc.CurrentUserEmail + rawdocid : rawdocid.substring(1))) : undefined;
                     const value = match[2]?.substring(1);
                     if (!fieldKey) {
                         const linkId = Utils.GenerateGuid();
-- 
cgit v1.2.3-70-g09d2