1 files changed, 26 insertions, 5 deletions
diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index bbe60776f..9cd35a3c4 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -6,7 +6,7 @@ import { observer } from "mobx-react";
 import { Doc } from "../../fields/Doc";
 import { RichTextField } from '../../fields/RichTextField';
 import { Cast, NumCast, StrCast } from "../../fields/Types";
-import { emptyFunction, setupMoveUpEvents } from "../../Utils";
+import { emptyFunction, setupMoveUpEvents, simulateMouseClick } from "../../Utils";
 import { GoogleAuthenticationManager } from '../apis/GoogleAuthenticationManager';
 import { Pulls, Pushes } from '../apis/google_docs/GoogleApiClientUtils';
 import { Docs } from '../documents/Documents';
@@ -218,8 +218,16 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`${isAnnotating ? "Exit" : "Enter"} annotation mode`}</div></>}>
             <div className="documentButtonBar-linker" style={{ backgroundColor: isAnnotating ? "white" : "", color: isAnnotating ? "black" : "white", }}
                 onClick={e => targetDoc.isAnnotating = !targetDoc.isAnnotating}>
-                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="edit"
-                />
+                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="edit" />
+            </div></Tooltip >;
+    }
+
+    @computed
+    get menuButton() {
+        const targetDoc = this.view0?.props.Document;
+        return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`Open Context Menu`}</div></>}>
+            <div className="documentButtonBar-linker" style={{ color: "white" }} onClick={e => this.openContextMenu(e)}>
+                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="bars" />
             </div></Tooltip >;
     }
 
@@ -229,8 +237,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         return !targetDoc ? (null) : <Tooltip title={<><div className="dash-tooltip">{`${CurrentUserUtils.propertiesWidth > 0 ? "Close" : "Open"} Properties Panel`}</div></>}>
             <div className="documentButtonBar-linker" style={{ color: "white" }} onClick={action(e =>
                 CurrentUserUtils.propertiesWidth = CurrentUserUtils.propertiesWidth > 0 ? 0 : 250)}>
-                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="ellipsis-h"
-                />
+                <FontAwesomeIcon className="documentdecorations-icon" size="sm" icon="ellipsis-h" />
             </div></Tooltip >;
     }
 
@@ -286,6 +293,17 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
                 </div></Tooltip>;
     }
 
+    openContextMenu = (e: React.MouseEvent) => {
+        let child = SelectionManager.SelectedDocuments()[0].ContentDiv!.children[0];
+        while (child.children.length) {
+            const next = Array.from(child.children).find(c => typeof (c.className) === "string");
+            if (next?.className.includes("documentView-node")) break;
+            if (next) child = next;
+            else break;
+        }
+        simulateMouseClick(child, e.clientX, e.clientY - 30, e.screenX, e.screenY - 30);
+    }
+
     render() {
         if (!this.view0) return (null);
 
@@ -324,6 +342,9 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
                 {this.considerGoogleDocsPull}
             </div>
             <div className="documentButtonBar-button">
+                {this.menuButton}
+            </div>
+            <div className="documentButtonBar-button">
                 {this.moreButton}
             </div>
         </div>;