Modifier key profile condition (#487)

* update Frontend options on modifier change

* add modifier key profile condition

* use select element for modifier condition value

* support "is" and "is not" modifier key conditions

* use plural

* remove dead null check

it's never null in that function

* pass element on rather than assigning to this

* rename event

* remove Firefox OS key to Meta detection

* hide Meta from dropdown on Firefox

* move input type

4 files changed, 24 insertions, 6 deletions

diff --git a/ext/mixed/js/core.js b/ext/mixed/js/core.js
index fbe9943a..835d9cea 100644
--- a/ext/mixed/js/core.js
+++ b/ext/mixed/js/core.js
@@ -146,6 +146,12 @@ function getSetIntersection(set1, set2) {
     return result;
 }
 
+function getSetDifference(set1, set2) {
+    return new Set(
+        [...set1].filter((value) => !set2.has(value))
+    );
+}
+
 
 /*
  * Async utilities
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index 32081c70..783af7d8 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -338,7 +338,7 @@ class Display {
     }
 
     onKeyDown(e) {
-        const key = Display.getKeyFromEvent(e);
+        const key = DOM.getKeyFromEvent(e);
         const handler = this._onKeyDownHandlers.get(key);
         if (typeof handler === 'function') {
             if (handler(e)) {
@@ -964,11 +964,6 @@ class Display {
         return elementRect.top - documentRect.top;
     }
 
-    static getKeyFromEvent(event) {
-        const key = event.key;
-        return (typeof key === 'string' ? (key.length === 1 ? key.toUpperCase() : key) : '');
-    }
-
     async _getNoteContext() {
         const documentTitle = await this.getDocumentTitle();
         return {
diff --git a/ext/mixed/js/dom.js b/ext/mixed/js/dom.js
index 31ba33d6..0e8f4462 100644
--- a/ext/mixed/js/dom.js
+++ b/ext/mixed/js/dom.js
@@ -63,6 +63,20 @@ class DOM {
         }
     }
 
+    static getActiveModifiers(event) {
+        const modifiers = new Set();
+        if (event.altKey) { modifiers.add('alt'); }
+        if (event.ctrlKey) { modifiers.add('ctrl'); }
+        if (event.metaKey) { modifiers.add('meta'); }
+        if (event.shiftKey) { modifiers.add('shift'); }
+        return modifiers;
+    }
+
+    static getKeyFromEvent(event) {
+        const key = event.key;
+        return (typeof key === 'string' ? (key.length === 1 ? key.toUpperCase() : key) : '');
+    }
+
     static getFullscreenElement() {
         return (
             document.fullscreenElement ||
diff --git a/ext/mixed/js/text-scanner.js b/ext/mixed/js/text-scanner.js
index 774eef44..d74a04f8 100644
--- a/ext/mixed/js/text-scanner.js
+++ b/ext/mixed/js/text-scanner.js
@@ -70,6 +70,9 @@ class TextScanner extends EventDispatcher {
             return;
         }
 
+        const modifiers = DOM.getActiveModifiers(e);
+        this.trigger('activeModifiersChanged', {modifiers});
+
         const scanningOptions = this.options.scanning;
         const scanningModifier = scanningOptions.modifier;
         if (!(