Choose window position from context menu

Author: zalmoxisus

src/app/constants/ContextMenus.js

@@ -1,16 +1,34 @@
 import openDevToolsWindow from './openWindow';
-import { MENU_DEVTOOLS } from '../../../app/constants/ContextMenus.js';
 
-function addToMenu(id, title, contexts, onClick) {
-  chrome.contextMenus.create({
-    id: id,
-    title: title,
-    contexts: contexts,
-    enabled: false,
-    onclick: onClick
+const menus = [
+  { id: 'devtools-left', title: 'To left (Alt+Shift+Left arrow)' },
+  { id: 'devtools-right', title: 'To right (Alt+Shift+Right arrow)' },
+  { id: 'devtools-bottom', title: 'To bottom (Alt+Shift+Down arrow)' },
+  { id: 'devtools-panel', title: 'In panel (Alt+Shift+Top arrow)' }
+];
+
+let pageUrl;
+let pageTab;
+
+export default function createMenu(forUrl, tabId) {
+  if (typeof tabId !== 'number' || tabId === pageTab) return;
+
+  let url = forUrl;
+  let hash = forUrl.indexOf('#');
+  if (hash !== -1) url = forUrl.substr(0, hash);
+  if (pageUrl === url) return;
+  pageUrl = url; pageTab = tabId;
+  chrome.contextMenus.removeAll();
+
+  menus.forEach(({ id, title }) => {
+    chrome.contextMenus.create({
+      id: id,
+      title: title,
+      contexts: ['all'],
+      documentUrlPatterns: [url],
+      onclick: () => { openDevToolsWindow(id); }
+    });
   });
-}
 
-export default function createMenu() {
-  addToMenu(MENU_DEVTOOLS, 'Open Redux DevTools', ['all'], openDevToolsWindow);
+  chrome.pageAction.show(tabId);
 }

src/browser/extension/background/contextMenus.js

@@ -1,14 +1,11 @@
 import createDevStore from '../../../app/store/createDevStore.js';
 import openDevToolsWindow from './openWindow';
-import createMenu from './contextMenus';
 import { toContentScript } from './messaging';
 
 const store = createDevStore((action) => {
   toContentScript(action);
 });
 
-createMenu();
-
 window.store = store;
 
 chrome.commands.onCommand.addListener(shortcut => {

src/browser/extension/background/index.js

@@ -1,6 +1,6 @@
 import { onConnect, onMessage, sendToTab } from 'crossmessaging';
 import syncOptions from '../options/syncOptions';
-import { MENU_DEVTOOLS } from '../../../app/constants/ContextMenus';
+import createMenu from './contextMenus';
 import openDevToolsWindow from './openWindow';
 let connections = {};
 
@@ -53,13 +53,7 @@ function messaging(request, sender, sendResponse) {
     store.liftedStore.setState(payload);
     if (request.init) {
       store.id = tabId;
-      if (typeof tabId === 'number') {
-        let url = sender.url;
-        let hash = url.indexOf('#');
-        if (hash !== -1) url = url.substr(0, hash);
-        chrome.contextMenus.update(MENU_DEVTOOLS, {documentUrlPatterns: [url], enabled: true});
-        chrome.pageAction.show(tabId);
-      }
+      createMenu(sender.url, tabId);
     }
     if (tabId in connections) {
       connections[ tabId ].postMessage({payload: payload});