Experimental adjustment of selections in the editor on triple click
authorAlexander Ebert <ebert@woltlab.com>
Tue, 21 Jan 2020 16:05:46 +0000 (17:05 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Tue, 21 Jan 2020 16:05:46 +0000 (17:05 +0100)
wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabCaret.js

index e324bd5a1fee8dbfb46796838c00cd870e751048..ecd881ae643a19623c7f9b1343bbbd450e998c1f 100644 (file)
@@ -59,7 +59,11 @@ $.Redactor.prototype.WoltLabCaret = function() {
                                        }).bind(this));
                                }
                                else {
-                                       editor.addEventListener(WCF_CLICK_EVENT, handleEditorClick);
+                                       editor.addEventListener(WCF_CLICK_EVENT, (function(event) {
+                                               this.WoltLabCaret._detectTripleClick(event);
+                                               
+                                               handleEditorClick(event);
+                                       }).bind(this));
                                        editor.addEventListener('mouseup', handleEditorMouseUp);
                                }
                                
@@ -438,6 +442,38 @@ $.Redactor.prototype.WoltLabCaret = function() {
                                }
                        }).bind(this));
                },
+
+               /**
+                * Many browsers will mark the entire line of text on triple click. However, the selection can
+                * sometimes spill into an adjacent block, for example, highlighting an entire line will also
+                * select the empty (!) start of the next line. For tables, this could cause the selection to
+                * include the - again empty - start of the adjacent cell.
+                * 
+                * @param {MouseEvent} event
+                * @protected
+                */
+               _detectTripleClick: function(event) {
+                       // Anything over 3 clicks behaves as a triple click.
+                       if (event.detail < 3) {
+                               return;
+                       }
+                       
+                       var selection = window.getSelection();
+                       if (!selection.isCollapsed) {
+                               var range = selection.getRangeAt(0);
+                               if (range.commonAncestorContainer.nodeName === 'TR') {
+                                       // The `<tr>` most likely indicates a selection that spans two cells, reduce the
+                                       // selection to only include the first cell.
+                                       var td = elClosest(range.startContainer, 'td');
+                                       
+                                       range = document.createRange();
+                                       range.selectNodeContents(td);
+                                       
+                                       selection.removeAllRanges();
+                                       selection.addRange(range);
+                               }
+                       }
+               },
                
                _handleEditorClick: function (event) {
                        var clientY = event.clientY;