Added support for isContentEditable

src/fg/js/frontend.js

@@ -29,32 +29,38 @@ class ODHFront {
     }
 
     onKeyDown(e) {
-        if (!this.activateKey)
+        if (!this.enabled)
+            return;
+
+        if (e.keyCode === this.exitKey || e.charCode === this.exitKey)
+            this.popup.hide();
+
+        if (!this.activateKey || !(e.keyCode === this.activateKey || e.charCode === this.activateKey))
             return;
 
-        if (!isValidElement())
+        if (!isValidElement(document.activeElement))
             return;
 
-        if (this.enabled && this.point !== null && (e.keyCode === this.activateKey || e.charCode === this.activateKey)) {
+        if (this.point !== null) {
             const range = rangeFromPoint(this.point);
             if (range == null) return;
             let textSource = new TextSourceRange(range);
             textSource.selectText();
             this.mousemoved = false;
             this.onSelectionEnd(e);
         }
-
-        if (e.keyCode === this.exitKey || e.charCode === this.exitKey)
-            this.popup.hide();
     }
 
     onDoubleClick(e) {
-        if (!this.mouseselection)
+        if (!this.enabled)
             return;
 
-        if (!isValidElement())
+        if (!this.mouseselection)
             return;
 
+        // if (!isValidElement(document.activeElement))
+        //     return;
+
         if (this.timeout)
             clearTimeout(this.timeout);
         this.mousemoved = false;
@@ -81,6 +87,11 @@ class ODHFront {
             clearTimeout(this.timeout);
         }
 
+        // if there's no text selected
+        if (window.getSelection().isCollapsed) {
+            return;
+        }
+
         // wait 500 ms after the last selection change event
         this.timeout = setTimeout(() => {
             this.onSelectionEnd(e);
@@ -94,18 +105,21 @@ class ODHFront {
         if (!this.enabled)
             return;
 
-        if (!isValidElement())
-            return;
+        // if (!isValidElement(document.activeElement))
+        //     return;
 
         // reset selection timeout
         this.timeout = null;
         const expression = selectedText();
         if (isEmpty(expression)) return;
 
+        // save the current point before sending the request
+        const point = this.point;
+
         let result = await getTranslation(expression);
         if (result == null || result.length == 0) return;
         this.notes = this.buildNote(result);
-        this.popup.showNextTo({ x: this.point.x, y: this.point.y, }, await this.renderPopup(this.notes));
+        this.popup.showNextTo({ x: point.x, y: point.y, }, await this.renderPopup(this.notes));
 
     }
 

src/fg/js/text.js

@@ -165,7 +165,7 @@ function getSentence(sentenceNum) {
 
     let node = selection.getRangeAt(0).commonAncestorContainer;
 
-    if (['INPUT', 'TEXTAREA'].indexOf(node.tagName) !== -1) {
+    if (!isValidElement(node)) {
         return;
     }
 
@@ -200,15 +200,12 @@ function selectedText() {
     return (selection.toString() || '').trim();
 }
 
-function isValidElement() {
-    // if (document.activeElement.getAttribute('contenteditable')) 
-    //     return false;
-
+function isValidElement(node) {
     const invalidTags = ['INPUT', 'TEXTAREA'];
-    const nodeName = document.activeElement.nodeName.toUpperCase();
-    if (invalidTags.includes(nodeName)) {
+    const nodeName = node.nodeName.toUpperCase();
+    if (invalidTags.includes(nodeName) || node.isContentEditable) {
         return false;
     } else {
         return true;
     }
-}
+}