fix earlier breaking changes for showing annotation bar and displaying context menu

1 files changed, 28 insertions, 16 deletions

diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 19135b6dd..fe5070fa4 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -69,10 +69,8 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
 
     constructor(props: any) {
         super(props);
-        // if (true) {// his.webField) {
-        //     Doc.SetNativeWidth(this.dataDoc, Doc.NativeWidth(this.dataDoc) || 850);
-        //     Doc.SetNativeHeight(this.dataDoc, Doc.NativeHeight(this.dataDoc) || this.Document[HeightSym]() / this.Document[WidthSym]() * 850);
-        // }
+        Doc.SetNativeWidth(this.dataDoc, Doc.NativeWidth(this.dataDoc) || 850);
+        Doc.SetNativeHeight(this.dataDoc, Doc.NativeHeight(this.dataDoc) || this.Document[HeightSym]() / this.Document[WidthSym]() * 850);
     }
 
     async componentDidMount() {
@@ -224,6 +222,18 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
             e.stopPropagation();
             e.preventDefault();
         }
+
+        // bcz: hack - iframe grabs all events which messes up how we handle contextMenus.  So this super naively simulates the event stack to get the specific menu items and the doc view menu items.
+        if (e.button === 2 && ContextMenu.Instance.getItems().length) {
+            ContextMenu.Instance.displayMenu(e.pageX, e.pageY);
+        }
+        else {
+            ContextMenu.Instance.closeMenu();
+            if (e.button === 2) {
+                this.specificContextMenu(e);
+                this.props.docViewPath().lastElement().docView?.onContextMenu(undefined, e.pageX, e.pageY);
+            }
+        }
     }
 
     getScrollHeight = () => this._scrollHeight;
@@ -391,20 +401,22 @@ export class WebBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProps
         );
     }
 
-    specificContextMenu = (e: React.MouseEvent): void => {
+    specificContextMenu = (e: React.MouseEvent | PointerEvent): void => {
         const cm = ContextMenu.Instance;
         const funcs: ContextMenuProps[] = [];
-        funcs.push({ description: (this.layoutDoc.useCors ? "Don't Use" : "Use") + " Cors", event: () => this.layoutDoc.useCors = !this.layoutDoc.useCors, icon: "snowflake" });
-        funcs.push({
-            description: (!this.layoutDoc.allowReflow ? "Allow" : "Prevent") + " Reflow", event: () => {
-                const nw = !this.layoutDoc.allowReflow ? undefined : Doc.NativeWidth(this.layoutDoc) - this.sidebarWidth() / (this.props.scaling?.() || 1);
-                this.layoutDoc.allowReflow = !nw;
-                if (nw) {
-                    Doc.SetInPlace(this.layoutDoc, this.fieldKey + "-nativeWidth", nw, true);
-                }
-            }, icon: "snowflake"
-        });
-        cm.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" });
+        if (!cm.findByDescription("Options...")) {
+            funcs.push({ description: (this.layoutDoc.useCors ? "Don't Use" : "Use") + " Cors", event: () => this.layoutDoc.useCors = !this.layoutDoc.useCors, icon: "snowflake" });
+            funcs.push({
+                description: (!this.layoutDoc.allowReflow ? "Allow" : "Prevent") + " Reflow", event: () => {
+                    const nw = !this.layoutDoc.allowReflow ? undefined : Doc.NativeWidth(this.layoutDoc) - this.sidebarWidth() / (this.props.scaling?.() || 1);
+                    this.layoutDoc.allowReflow = !nw;
+                    if (nw) {
+                        Doc.SetInPlace(this.layoutDoc, this.fieldKey + "-nativeWidth", nw, true);
+                    }
+                }, icon: "snowflake"
+            });
+            cm.addItem({ description: "Options...", subitems: funcs, icon: "asterisk" });
+        }
     }
 
     @action