new strategy for detecting backspace

BlueprintSys · Jul 17, 2018 · ad5351c · ad5351c
1 parent f3c0de0
commit ad5351c
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/index.js b/index.js
@@ -257,8 +257,21 @@
 
                 //BACKSPACE
                 case 8:
-                    if (this.query !== '') {
-                        this.lookup();
+                    switch (this.query.length) {
+                        case 0: // The user has removed the delimiter as well
+                            this.cleanUp(true);
+                            break;
+                        case 1: // The user has removed everything except the delimiter. We need to remove some extra tags that TinyMce adds to keep the autocomplte working
+                            var caret = this.editor.dom.select('span#autocomplete span#_mce_caret')[0];
+                            var searchtext = this.editor.dom.select('span#autocomplete span#autocomplete-searchtext')[0];
+                            this.editor.dom.add(caret.parentElement, searchtext);
+                            this.editor.dom.remove(caret);
+
+                            this.editor.selection.select(this.editor.selection.dom.select('span#autocomplete-searchtext span')[0]);
+                            this.editor.selection.collapse(0);
+                            break;
+                        default:
+                            this.lookup();
                     }
                     break;
 
@@ -328,7 +341,6 @@
             }
         },
 
-
         rteLostFocus: function () {
             if (this.hasFocus) {
                 this.cleanUp(true);
@@ -343,7 +355,7 @@
             }
 
             this.query = this.jsH.trim(editorBody.innerText).replace('\ufeff', '');
-        
+
             if (this.dropdown === undefined) {
                 this.show();
             }
@@ -357,11 +369,11 @@
                 }
             }.bind(this), this.options.delay);
         },
+
         matcher: function (item) {
             return ~item[this.options.queryBy].toLowerCase().indexOf(this.query.toLowerCase());
         },
 
-
         sorter: function (items) {
             var beginswith = [],
                 caseSensitive = [],
@@ -452,7 +464,6 @@
             }
         },
 
-
         renderDropdown: function () {
             return '<ul class="rte-autocomplete tinymce-mention dropdown-menu"><li class="loading"></li></ul>'; //need to add a class starting with "mce-" to not make the inline editor disappear
         },
@@ -481,6 +492,7 @@
         highlightNextResult: function () {
             this.highlightResult(1);
         },
+
         highlightResult: function (direction) {
             var activeLi = this.dropdown.querySelector('li.active'),
                 items = Array.prototype.slice.call(this.dropdown.children),

diff --git a/package.json b/package.json
@@ -1,14 +1,14 @@
 {
-    "name": "tinymce-mention-nojq",
-    "version": "4.0.3",
+    "name": "tinymce-mention-plugin",
+    "version": "4.0.4",
     "repository": {
         "type": "git",
         "url": "https://github.com/BlueprintSys/tinymce-mention-plugin"
     },
     "description": "Mention/Autocomplete plugin for TinyMCE WYSIWYG editor (no jQuery dependent)",
     "author": "Steven Devooght",
     "bugs": {
-        "url": "https://github.com/BlueprintSys/tinymce-mention-nojq/issues"
+        "url": "https://github.com/BlueprintSys/tinymce-mention-plugin/issues"
     },
     "main": "index.js",
     "license": "MIT"