Better [DEL] behavior for empty headings

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabKeydown.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabKeydown.js
index e542e7be1d63f83a60e3348575b837343aa0a9f2..ebb02bdf8b0a8a3846eef1e2ad631bbf9dce005f 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabKeydown.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabKeydown.js
@@ -100,6 +100,28 @@ $.Redactor.prototype.WoltLabKeydown = function() {
                                                                }
                                                        }
                                                }
+                                               else if (e.originalEvent.which === this.keyCode.DELETE && ['H1', 'H2', 'H3', 'H4', 'H5', 'H6'].indexOf(container.nodeName) !== -1 && this.utils.isEmpty(container.innerHTML)) {
+                                                       // Pressing the [DEL] key inside an empty heading should remove the heading entirely, instead
+                                                       // of moving the next element's content into it. There are two situations that need to be handled:
+                                                       // 
+                                                       //   1. There is adjacent content, remove the heading and set the caret at the beginning of it.
+                                                       //   2. The heading is the last element, replace it with a `<p>` and move the caret inside of it.
+                                                       var nextElement = container.nextElementSibling;
+                                                       if (nextElement) {
+                                                               nextElement = container.nextElementSibling;
+                                                       }
+                                                       else {
+                                                               nextElement = elCreate('p');
+                                                               nextElement.innerHTML = this.opts.invisibleSpace;
+                                                               container.parentNode.appendChild(nextElement);
+                                                       }
+                                                       
+                                                       container.parentNode.removeChild(container);
+                                                       this.caret.start(nextElement);
+                                                       
+                                                       e.originalEvent.preventDefault();
+                                                       return;
+                                               }
                                                else if (this.detect.isWebkit() && container.nodeName === 'LI' && e.which === this.keyCode.DELETE) {
                                                        // check if caret is at the end of the list item, and if there is an adjacent list item
                                                        var anchorNode = selection.anchorNode;