Add a pane in the dashboard to assign keyboard shortcut

#250

Co-authored-by:  gorhill <585534+gorhill@users.noreply.github.com>

platform/firefox/vapi-background.js

@@ -3330,7 +3330,7 @@ vAPI.contextMenu = (function() {
 // Assuming only one client listener is installed.
 
 // Shortcuts can be customized in `about:config` using
-//     extensions.ublock0.shortcuts.[command id]    => modifier-key
+//     extensions.ublock0.shortcuts.[command id]    => modifier-key or modifier-VK_name
 // To disable a shortcut, set it to `-`:
 //     extensions.ublock0.shortcuts.[command id]    => -
 
@@ -3338,9 +3338,9 @@ vAPI.commands = (function() {
     if ( vAPI.fennec || vAPI.thunderbird ) { return; }
 
     var commands = [
-        { id: 'launch-element-zapper' },
-        { id: 'launch-element-picker' },
-        { id: 'launch-logger' }
+        { name: 'launch-element-zapper', description: "__MSG_popupTipZapper__" },
+        { name: 'launch-element-picker', description: "__MSG_popupTipPicker__" },
+        { name: 'launch-logger', description: "__MSG_popupTipLog__" }
     ];
     var clientListener;
 
@@ -3351,41 +3351,87 @@ vAPI.commands = (function() {
         clientListener(match[1]);
     };
 
-    var canRegister = function(win) {
+    var browserWindow = Components.classes["@mozilla.org/appshell/window-mediator;1"].getService(Components.interfaces.nsIWindowMediator).getMostRecentWindow("navigator:browser");
+
+    var getAll = function () {
+        for (var command of commands) {
+            command.shortcut = vAPI.localStorage.getItem('shortcuts.' + command.name)
+                .replace("alt", "Alt")
+                .replace("shift", "Shift")
+                .replace("accel", "Ctrl")
+                .replace(new RegExp("\\-", 'g'), "+")
+                .replace("VK_", "")
+                .replace("Page_", "Page");
+        };
+        return commands;
+    };
+
+    var update = function (name, shortcut) {
+        vAPI.localStorage.setItem('shortcuts.' + name, shortcut.replace(new RegExp("\\+", 'g'), "-")
+            .replace("Alt", "alt")
+            .replace("Shift", "shift")
+            .replace("Ctrl", "accel")
+            .replace(/(F[1-9]|F1[0-2]|Home|End|Insert|Delete|Up|Down|Left|Right|Period|Comma|Space)$/i, "VK_$1")
+            .replace("Page", "VK_$1_"));
+        vAPI.commands.unregister(browserWindow);
+        vAPI.commands.register(browserWindow);
+    };
+
+    var reset = function (name) {
+        vAPI.localStorage.setItem('shortcuts.' + name, "");
+        vAPI.commands.unregister(browserWindow);
+        vAPI.commands.register(browserWindow);
+    };
+
+    var canRegister = function (win) {
         return win && win.document.readyState === 'complete';
     };
 
-    var register = function(window) {
-        if ( canRegister(window) !== true ) { return; }
+    var register = function (window) {
+        if (canRegister(window) !== true) { return; }
 
         var doc = window.document,
             myKeyset = doc.getElementById('uBlock0Keyset');
         // Already registered?
-        if ( myKeyset !== null ) { return; }
+        if (myKeyset !== null) { return; }
 
         var mainKeyset = doc.getElementById('mainKeyset'),
             keysetHolder = mainKeyset && mainKeyset.parentNode;
-        if ( keysetHolder === null ) { return; }
+        if (keysetHolder === null) { return; }
 
         myKeyset = doc.createElement('keyset');
         myKeyset.setAttribute('id', 'uBlock0Keyset');
 
-        var myKey, shortcut, parts, modifiers, key;
-        for ( var command of commands ) {
-            modifiers = key = '';
-            shortcut = vAPI.localStorage.getItem('shortcuts.' + command.id);
-            if ( shortcut === null ) {
-                vAPI.localStorage.setItem('shortcuts.' + command.id, '');
-            } else if ( (parts = /^((?:[a-z]+-){1,})?(\w)$/.exec(shortcut)) !== null ) {
-                modifiers = (parts[1] || '').slice(0, -1).replace(/-/g, ',');
-                key = parts[2] || '';
+        var myKey, shortcut, modifiers, key, keycode;
+        for (var command of commands) {
+            modifiers = key = [];
+            shortcut = vAPI.localStorage.getItem('shortcuts.' + command.name);
+            if (!shortcut) {
+                vAPI.localStorage.setItem('shortcuts.' + command.name, '');
+            } else {
+                var keys = shortcut.split("-");
+                modifiers.push(keys[0]);
+                if (keys.length == 3) {
+                    modifiers.push(keys[1]);
+                }
+                modifiers = modifiers.join(" ");
+                key = keys.pop();
+                if (key.length > 1) {
+                    keycode = key;
+                }
             }
             myKey = doc.createElement('key');
-            myKey.setAttribute('id', 'uBlock0Key-' + command.id);
-            if ( modifiers !== '' ) {
+            myKey.setAttribute('id', 'uBlock0Key-' + command.name);
+
+            if (modifiers.length > 0) {
                 myKey.setAttribute('modifiers', modifiers);
             }
-            myKey.setAttribute('key', key);
+            if (keycode) {
+                myKey.setAttribute('keycode', keycode);
+            } else {
+                myKey.setAttribute('key', key);
+            }
+
             // https://stackoverflow.com/a/16786770
             myKey.setAttribute('oncommand', ';');
             myKeyset.appendChild(myKey);
@@ -3421,7 +3467,10 @@ vAPI.commands = (function() {
         unregister: unregister,
         onCommand: {
             addListener: addListener
-        }
+        },
+        getAll: getAll,
+        update: update,
+        reset: reset
     };
 })();
 

src/_locales/ar/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "جيغا بايت",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "الاختصارات",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "ادخل اختصار",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/bg/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "ГБ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Клавишни комбинации",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Натиснете клавиши",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/bn/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "গিগাবাইট",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "শর্টকাটগুলি",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "শর্টকাট লিখুন",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ca/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Dreceres",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Escriviu una drecera",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/cs/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Zkratky",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Stiskněte zkratku",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/cv/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Shortcuts",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Type a shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/da/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Genveje",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Angiv en genvej",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/de/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Tastenkürzel",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Tastaturkürzel festlegen",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/el/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Συντομεύσεις",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Πληκτρολογήστε μια συντόμευση",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/en/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Shortcuts",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Type a shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/eo/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Alirklavoj",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Type a shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/es/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Atajos",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Escribe un atajo",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/et/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Kiirklahvid",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Kirjuta kiirklahv",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/eu/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Lasterbideak",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Idatzi lasterbide bat",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/fa/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "میانبرها",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "یک میانبر وارد کنید",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/fi/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "Gt",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Pikanäppäimet",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Syötä pikanäppäimet",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/fil/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Mga daang tuwiran",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Mag-sulat ng shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/fr/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "Go",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Raccourcis",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Saisir un raccourci",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/fy/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Fluchtoetsen",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Typ in fluchtoets",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/gl/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Atallos",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Introduce un atallo",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/he/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "קיצורי דרך",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "הקלד קיצור דרך",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/hi/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "जीबी",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "शॉर्टकट",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "शॉर्टकट को टाइप करें ",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/hr/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Tipkovni prečaci",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Utipkajte tipkovni prečac",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/hu/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Billentyűparancsok",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Billentyűkombináció megadása",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/id/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Pintasan",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Ketik pintasan",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/it/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Scorciatoie",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Digita una scorciatoia",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ja/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "ショートカットキー",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "ショートカットを入力",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ka/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "გბ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "მალსახმობები",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "მალსახმობის მითითება",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/kk/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "ГБ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Жапсырм-р",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Жарлық теріңіз",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/kn/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Shortcuts",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Type a shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ko/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "단축키",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "단축키를 입력하세요",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/lt/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Nuorodos",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Įveskite nuorodą",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/lv/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Īsceļi",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Ievadīt saīsni",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ml/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "ജി.ബി.",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "കുറുക്കുവഴികൾ",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "ഒരു കുറുക്കുവഴി ടൈപ്പുചെയ്യുക",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/mr/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Shortcuts",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Type a shortcut",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ms/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Pintasan",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Taipkan jalan pintas",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/nb/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Snarveier",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Oppfør en snarvei",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/nl/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Sneltoetsen",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Typ een sneltoets",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/pl/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Skróty",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Wprowadź skrót",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/pt_BR/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Atalhos",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Digite um atalho",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/pt_PT/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Atalhos",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Digitar um atalho",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ro/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Comenzi rapide",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Tastează o comandă rapidă",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ru/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "ГБ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Сочетания клавиш",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Введите сочетание",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/sk/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Klávesové skratky",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Zadajte klávesovú skratku",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/sl/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Bližnjice",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Vnesite bližnjico",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/sq/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Shkurtoret",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Vendosni kombinimin",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/sr/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Пречице",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Укуцајте пречицу",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/sv/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Genvägar",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Ange en genväg",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/ta/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "குறுக்குவழிகள்",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "குறுக்குவழியைத் தட்டச்சு செய்க",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/te/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "జీబీ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "షార్ట్కట్లు",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "షార్ట్కట్ టైప్ చేయండి",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/tr/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Kısayollar",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Bir kısayol girin",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/uk/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "ГБ",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Комбінації клавіш",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Уведіть комбінацію",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/vi/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "Phím tắt",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "Nhập phím tắt",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/zh_CN/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "快捷键",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "键入快捷键",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/_locales/zh_TW/messages.json

@@ -830,5 +830,13 @@
   "GB": {
     "message": "GB",
     "description": "short for 'gigabytes'"
+  },
+  "shortcutsPageName": {
+    "message": "快捷鍵",
+    "description": "appears as tab name in dashboard"
+  },
+  "shortcutCapturePlaceholder": {
+    "message": "輸入快捷鍵",
+    "description": "Placeholder string for input field used to capture a keyboard shortcut"
   }
 }

src/css/dashboard.css

@@ -78,6 +78,10 @@ iframe {
     width: 100vw;
     }
 
+body:not(.canUpdateShortcuts) .tabButton[href="#shortcuts.html"] {
+    display: none;
+    }
+
 /* high dpi devices */
 :root.hidpi .tabButton {
     font-family: Metropolis, sans-serif;

src/css/shortcuts.css

@@ -0,0 +1,55 @@
+/**
+    uBlock Origin - a browser extension to block requests.
+    Copyright (C) 2018-present Raymond Hill
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see {http://www.gnu.org/licenses/}.
+
+    Home: https://github.com/gorhill/uBlock
+*/
+
+.commandEntries {
+    margin: 2em;
+    }
+
+.commandEntries td {
+    padding: 0.5em 0.25em;
+    }
+
+.commandEntries td.commandDesc {
+    text-align: end;
+    }
+
+.commandEntries td.commandShortcut {
+    white-space: nowrap;
+    }
+
+.commandEntries td.commandShortcut input {
+    padding: 0.4em;
+    }
+
+.commandEntries td.commandShortcut input:focus {
+    outline: 2px solid blue;
+    }
+
+.commandEntries td.commandShortcut input ~ .commandReset {
+    cursor: pointer;
+    font-size: 150%;
+    padding: 0 0.2em;
+    vertical-align: middle;
+    }
+
+.commandEntries td.commandShortcut input:placeholder-shown ~ .commandReset,
+.commandEntries td.commandShortcut input:focus ~ .commandReset {
+    display: none;
+    }

src/dashboard.html

@@ -18,6 +18,7 @@
  --><span class="tabButton" data-pane="1p-filters.html" data-i18n="1pPageName"></span><!--
  --><span class="tabButton" data-pane="dyna-rules.html" data-i18n="rulesPageName"></span><!--
  --><span class="tabButton" data-pane="whitelist.html" data-i18n="whitelistPageName"></span><!--
+ --><span class="tabButton" data-pane="shortcuts.html" data-i18n="shortcutsPageName"></span><!--
  --><span class="tabButton" data-pane="about.html" data-i18n="aboutPageName"></span>
 </div>
 <div id="unsavedWarning">

src/js/commands.js

@@ -1,7 +1,7 @@
 /*******************************************************************************
 
     uBlock Origin - a browser extension to block requests.
-    Copyright (C) 2017 Raymond Hill
+    Copyright (C) 2017-present Raymond Hill
 
     This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU General Public License as published by
@@ -25,8 +25,15 @@
 
 /******************************************************************************/
 
+µBlock.canUseShortcuts = vAPI.commands instanceof Object;
+
+µBlock.canUpdateShortcuts = µBlock.canUseShortcuts &&
+                            typeof vAPI.commands.update === 'function';
+
+/******************************************************************************/
+
 (function() {
-    if ( vAPI.commands === undefined ) { return; }
+    if ( µBlock.canUseShortcuts === false ) { return; }
 
     vAPI.commands.onCommand.addListener(function(command) {
         var µb = µBlock;

src/js/dashboard.js

@@ -107,7 +107,11 @@ const onTabClickHandler = function(ev) {
 
 /******************************************************************************/
 
-uDom.onLoad(function() {
+uDom.onLoad(function () {
+    // https://github.com/uBlockOrigin/uBlock-issues/issues/106
+    vAPI.messaging.send('dashboard', { what: 'canUpdateShortcuts' }, response => {
+        document.body.classList.toggle('canUpdateShortcuts', response === true);
+    });
     let pane = vAPI.localStorage.getItem('dashboardLastVisitedPane');
     loadDashboardPanel(pane !== null ? pane : 'settings.html', true);
     uDom('.tabButton').on('click', onTabClickHandler);

src/js/messaging.js

@@ -1,7 +1,7 @@
 /*******************************************************************************
 
     uBlock Origin - a browser extension to block requests.
-    Copyright (C) 2014-2018 Raymond Hill
+    Copyright (C) 2014-present Raymond Hill
 
     This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU General Public License as published by
@@ -737,6 +737,38 @@ var µb = µBlock;
 
 /******************************************************************************/
 
+// Shortcuts pane
+
+let getShortcuts = function(callback) {
+    if ( µb.canUseShortcuts === false ) {
+        return callback([]);
+    }
+
+    let response = [];
+    for (let command of vAPI.commands.getAll()) {
+        let desc = command.description;
+        let match = /^__MSG_(.+?)__$/.exec(desc);
+        if ( match !== null ) {
+            desc = vAPI.i18n(match[1]);
+        }
+        if ( desc === '' ) { continue; }
+        command.description = desc;
+        response.push(command);
+    }
+    callback(response);
+};
+
+let setShortcut = function(details) {
+    if  ( µb.canUpdateShortcuts === false ) { return; }
+    if ( details.shortcut === undefined ) {
+        vAPI.commands.reset(details.name);
+    } else {
+        vAPI.commands.update(details.name, details.shortcut);
+    }
+};
+
+/******************************************************************************/
+
 // Settings
 
 var getLocalData = function(callback) {
@@ -962,6 +994,9 @@ var onMessage = function(request, sender, callback) {
     case 'getLocalData':
         return getLocalData(callback);
 
+    case 'getShortcuts':
+        return getShortcuts(callback);
+
     case 'readUserFilters':
         return µb.loadUserFilters(callback);
 
@@ -976,6 +1011,10 @@ var onMessage = function(request, sender, callback) {
     var response;
 
     switch ( request.what ) {
+    case 'canUpdateShortcuts':
+        response = µb.canUpdateShortcuts;
+        break;
+
     case 'getRules':
         response = getRules();
         break;
@@ -1017,6 +1056,10 @@ var onMessage = function(request, sender, callback) {
         resetUserData();
         break;
 
+    case 'setShortcut':
+        setShortcut(request);
+        break;
+
     case 'writeHiddenSettings':
         µb.changeHiddenSettings(µb.hiddenSettingsFromString(request.content));
         break;

src/js/shortcuts.js

@@ -0,0 +1,221 @@
+/*******************************************************************************
+
+    uBlock Origin - a browser extension to block requests.
+    Copyright (C) 2018-present Raymond Hill
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see {http://www.gnu.org/licenses/}.
+
+    Home: https://github.com/gorhill/uBlock
+*/
+
+'use strict';
+
+(function() {
+
+    // https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/commands#Shortcut_values
+    let validStatus0Keys = new Map([
+        [ 'alt', 'Alt' ],
+        [ 'control', 'Ctrl' ],
+    ]);
+    let validStatus1Keys = new Map([
+        [ 'a', 'A' ],
+        [ 'b', 'B' ],
+        [ 'c', 'C' ],
+        [ 'd', 'D' ],
+        [ 'e', 'E' ],
+        [ 'f', 'F' ],
+        [ 'g', 'G' ],
+        [ 'h', 'H' ],
+        [ 'i', 'I' ],
+        [ 'j', 'J' ],
+        [ 'k', 'K' ],
+        [ 'l', 'L' ],
+        [ 'm', 'M' ],
+        [ 'n', 'N' ],
+        [ 'o', 'O' ],
+        [ 'p', 'P' ],
+        [ 'q', 'Q' ],
+        [ 'r', 'R' ],
+        [ 's', 'S' ],
+        [ 't', 'T' ],
+        [ 'u', 'U' ],
+        [ 'v', 'V' ],
+        [ 'w', 'W' ],
+        [ 'x', 'X' ],
+        [ 'y', 'Y' ],
+        [ 'z', 'Z' ],
+        [ '0', '0' ],
+        [ '1', '1' ],
+        [ '2', '2' ],
+        [ '3', '3' ],
+        [ '4', '4' ],
+        [ '5', '5' ],
+        [ '6', '6' ],
+        [ '7', '7' ],
+        [ '8', '8' ],
+        [ '9', '9' ],
+        [ 'f1', 'F1' ],
+        [ 'f2', 'F2' ],
+        [ 'f3', 'F3' ],
+        [ 'f4', 'F4' ],
+        [ 'f5', 'F5' ],
+        [ 'f6', 'F6' ],
+        [ 'f7', 'F7' ],
+        [ 'f8', 'F8' ],
+        [ 'f9', 'F9' ],
+        [ 'f10', 'F10' ],
+        [ 'f11', 'F11' ],
+        [ 'f12', 'F12' ],
+        [ ' ', 'Space' ],
+        [ ',', 'Comma' ],
+        [ '.', 'Period' ],
+        [ 'home', 'Home' ],
+        [ 'end', 'End' ],
+        [ 'pageup', 'PageUp' ],
+        [ 'pagedown', 'PageDown' ],
+        [ 'insert', 'Insert' ],
+        [ 'delete', 'Delete' ],
+        [ 'arrowup', 'Up' ],
+        [ 'arrowdown', 'Down' ],
+        [ 'arrowleft', 'Left' ],
+        [ 'arrowright', 'Right' ],
+        [ 'shift', 'Shift' ],
+    ]);
+
+    let commandNameFromElement = function(elem) {
+        while ( elem !== null ) {
+            let name = elem.getAttribute('data-name');
+            if ( typeof name === 'string' && name !== '' ) { return name; }
+            elem = elem.parentElement;
+        }
+    };
+
+    let captureShortcut = function(ev) {
+        let input = ev.target;
+        let name = commandNameFromElement(input);
+        if ( name === undefined ) { return; }
+
+        let before = input.value;
+        let after = new Set();
+        let status = 0;
+
+        let updateCapturedShortcut = function() {
+            return (input.value = Array.from(after).join('+'));
+        };
+
+        let blurHandler = function() {
+            input.removeEventListener('blur', blurHandler, true);
+            input.removeEventListener('keydown', keydownHandler, true);
+            input.removeEventListener('keyup', keyupHandler, true);
+            if ( status === 2 ) {
+                vAPI.messaging.send(
+                    'dashboard',
+                    { what: 'setShortcut', name: name, shortcut: updateCapturedShortcut() }
+                );
+            } else {
+                input.value = before;
+            }
+        };
+
+        let keydownHandler = function(ev) {
+            ev.preventDefault();
+            ev.stopImmediatePropagation();
+            if ( ev.code === 'Escape' ) {
+                input.blur();
+                return;
+            }
+            if ( status === 0 ) {
+                let keyName = validStatus0Keys.get(ev.key.toLowerCase());
+                if ( keyName !== undefined ) {
+                    after.add(keyName);
+                    updateCapturedShortcut();
+                    status = 1;
+                }
+                return;
+            }
+            if ( status === 1 ) {
+                if ( ev.key === 'Shift' ) {
+                    after.add('Shift');
+                    updateCapturedShortcut();
+                    return;
+                }
+                let keyName = validStatus1Keys.get(ev.key.toLowerCase());
+                if ( keyName !== undefined ) {
+                    after.add(keyName);
+                    updateCapturedShortcut();
+                    status = 2;
+                    input.blur();
+                    return;
+                }
+            }
+        };
+
+        let keyupHandler = function(ev) {
+            ev.preventDefault();
+            ev.stopImmediatePropagation();
+            if ( status !== 1 ) { return; }
+            let keyName = validStatus0Keys.get(ev.key.toLowerCase());
+            if ( keyName !== undefined && after.has(keyName) ) {
+                after.clear();
+                updateCapturedShortcut();
+                status = 0;
+                return;
+            }
+            if ( ev.key === 'Shift' ) {
+                after.delete('Shift');
+                updateCapturedShortcut();
+                return;
+            }
+        };
+
+        input.value = '';
+        input.addEventListener('blur', blurHandler, true);
+        input.addEventListener('keydown', keydownHandler, true);
+        input.addEventListener('keyup', keyupHandler, true);
+    };
+
+    let resetShortcut = function(ev) {
+        let name = commandNameFromElement(ev.target);
+        if ( name === undefined ) { return; }
+
+        let input = document.querySelector('[data-name="' + name + '"] input');
+        if ( input === null ) { return; }
+        input.value = '';
+        vAPI.messaging.send(
+            'dashboard',
+            { what: 'setShortcut', name: name }
+        );
+    };
+
+    let onShortcutsReady = function(commands) {
+        if ( Array.isArray(commands) === false ) { return; }
+        let template = document.querySelector('#templates .commandEntry');
+        let tbody = document.querySelector('.commandEntries tbody');
+        for ( let command of commands ) {
+            if ( command.description === '' ) { continue; }
+            let tr = template.cloneNode(true);
+            tr.setAttribute('data-name', command.name);
+            tr.querySelector('.commandDesc').textContent = command.description;
+            let input = tr.querySelector('.commandShortcut input');
+            input.setAttribute('data-name', command.name);
+            input.value = command.shortcut;
+            input.addEventListener('focus', captureShortcut);
+            tr.querySelector('.commandReset').addEventListener('click', resetShortcut);
+            tbody.appendChild(tr);
+        }
+    };
+
+    vAPI.messaging.send('dashboard', { what: 'getShortcuts' }, onShortcutsReady);
+
+})();

src/shortcuts.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>uBlock Origin — Keyboard shortcuts</title>
+<link rel="stylesheet" type="text/css" href="css/themes/default.css">
+<link rel="stylesheet" type="text/css" href="css/common.css">
+<link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
+<link rel="stylesheet" type="text/css" href="css/shortcuts.css">
+</head>
+
+<body>
+
+<div class="body">
+    <table class="commandEntries"><tbody></tbody></table>
+</div>
+
+<div id="templates" style="display: none;">
+    <table>
+        <tr class="commandEntry">
+            <td class="commandDesc">
+            <td class="commandShortcut">
+                <input type="text" placeholder="shortcutCapturePlaceholder">
+                <button class="commandReset" type="button">&times;</button>
+    </div>
+</div>
+
+<script src="js/vapi.js"></script>
+<script src="js/vapi-common.js"></script>
+<script src="js/vapi-client.js"></script>
+<script src="js/udom.js"></script>
+<script src="js/i18n.js"></script>
+<script src="js/dashboard-common.js"></script>
+<script src="js/shortcuts.js"></script>
+
+</body>
+</html>