Show context menu where user right clicked

MisterPhilip · Apr 19, 2019 · 61d507a · 61d507a
1 parent 56687a1
commit 61d507a
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 4 deletions.
diff --git a/src/devtools/panel.js b/src/devtools/panel.js
@@ -97,7 +97,8 @@ window.Omnibug = (() => {
                 e.preventDefault();
                 let parameterKey = tableRow.getAttribute("data-parameter-key"),
                     parameterName = tableRow.querySelector(".parameter-field").innerText,
-                    parameterValue = tableRow.querySelector(".parameter-value");
+                    parameterValue = tableRow.querySelector(".parameter-value").innerText,
+                    parentTD = (e.target.tagName === "TD") ? e.target : e.target.closest("td");
 
                 let popoverTemplate = d.getElementById("row-context-menu-template"),
                     popover = d.importNode(popoverTemplate.content, true);
@@ -111,11 +112,17 @@ window.Omnibug = (() => {
                 popover.querySelectorAll(".context-menu-parameter-name").forEach((elem) => {
                     elem.innerText = parameterName;
                 });
-                popover.querySelector(`[data-context-menu="copy"]`).setAttribute("data-value", parameterValue.innerText);
+                popover.querySelector(`[data-context-menu="copy"]`).setAttribute("data-value", parameterValue);
                 if (settings.highlightKeys.indexOf(parameterKey) !== -1) {
                     popover.querySelector(".context-menu-highlight-action").innerText = "Un-highlight";
                 }
-                parameterValue.appendChild(popover);
+                popover.querySelector(".context-menu").style.top = e.offsetY + "px";
+                if((document.documentElement.clientWidth - 200) < e.clientX) {
+                    popover.querySelector(".context-menu").style.left = (e.offsetX - 200) + "px";
+                } else {
+                    popover.querySelector(".context-menu").style.left = e.offsetX + "px";
+                }
+                parentTD.appendChild(popover);
             }
         }
     });

diff --git a/src/devtools/panel.scss b/src/devtools/panel.scss
@@ -290,7 +290,7 @@ body.persist-disabled #persist-disable {
   display: none;
 }
 #persist-enable { color: #F44336; }
-td.parameter-value {
+tr[data-parameter-key] td {
   position: relative;
 }
 .context-menu.menu {