Fixed inline code behavior in iOS Safari

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
index 1ce17fd2edfe03f4a35b4487aab1fc827b8bf840..a5878426d1ed6fa17d3a6151abb987e1260781e4 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabButton.js
@@ -8,6 +8,17 @@ $.Redactor.prototype.WoltLabButton = function() {
                        // tooltips are handled on our own
                        this.button.buildButtonTooltip = function () {};
                        
+                       var mpClickCallback = this.button.clickCallback;
+                       this.button.clickCallback = (function(e, callback, btnName, args) {
+                               // prevent the browser from breaking the editor focus
+                               if (typeof e.preventDefault === 'function') {
+                                       e.preventDefault();
+                               }
+                               
+                               //noinspection JSUnresolvedFunction
+                               mpClickCallback.call(this, e, callback, btnName, args);
+                       }).bind(this);
+                       
                        // add custom buttons
                        var button, buttonName, i, length;
                        //noinspection JSUnresolvedVariable
@@ -80,7 +91,7 @@ $.Redactor.prototype.WoltLabButton = function() {
                                button[0].classList.add('jsTooltip');
                                
                                // update dropdown label for list
-                               if (buttonName == 'lists') {
+                               if (buttonName === 'lists') {
                                        var dropdown = button.data('dropdown');
                                        elBySel('.redactor-dropdown-outdent span', dropdown[0]).textContent = WCF.Language.get('wcf.editor.list.outdent');
                                        elBySel('.redactor-dropdown-indent span', dropdown[0]).textContent = WCF.Language.get('wcf.editor.list.indent');

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabInlineCode.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabInlineCode.js
index ad383b8fc3e0974c607035820fd3bf351dcec39e..59a7e811200a5507a296c40dfc2877669cd8f34d 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabInlineCode.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabInlineCode.js
@@ -1,11 +1,15 @@
 $.Redactor.prototype.WoltLabInlineCode = function() {
        "use strict";
        
+       var _environment;
+       
        return {
                init: function() {
                        this.opts.activeButtonsStates.kbd = 'tt';
                        
-                       require(['EventHandler'], (function (EventHandler) {
+                       require(['Environment', 'EventHandler'], (function (Environment, EventHandler) {
+                               _environment = Environment;
+                               
                                EventHandler.add('com.woltlab.wcf.redactor2', 'bbcode_tt_' + this.$element[0].id, this.WoltLabInlineCode._toggle.bind(this));
                        }).bind(this));
                },
@@ -15,11 +19,33 @@ $.Redactor.prototype.WoltLabInlineCode = function() {
                        
                        this.button.toggle({}, 'kbd', 'func', 'inline.format');
                        
-                       var node = window.getSelection().anchorNode;
+                       var selection = window.getSelection();
+                       var node = selection.anchorNode;
                        if (node.nodeType === Node.TEXT_NODE) node = node.parentNode;
                        
                        if (node.nodeName === 'KBD') {
                                var nextSibling = node.nextSibling;
+                               
+                               if (_environment.platform() === 'ios' && _environment.browser() === 'safari') {
+                                       // iOS Safari work-around to allow caret placement after <kbd>
+                                       if (nextSibling && nextSibling.nodeName === 'BR') {
+                                               node.parentNode.insertBefore(document.createTextNode('\u200B'), nextSibling);
+                                       }
+                                       
+                                       // fix selection position
+                                       if (node.innerHTML === '\u200B') {
+                                               // the caret must be at offset 0 (before the whitespace)
+                                               var range = selection.getRangeAt(0);
+                                               if (range.collapsed && range.startOffset === 1) {
+                                                       node.innerHTML = this.marker.html() + '\u200B';
+                                                       
+                                                       this.selection.restore();
+                                               }
+                                       }
+                                       
+                                       return;
+                               }
+                               
                                while (nextSibling) {
                                        if (nextSibling.nodeType !== Node.TEXT_NODE || nextSibling.textContent.length) {
                                                return;
@@ -30,9 +56,11 @@ $.Redactor.prototype.WoltLabInlineCode = function() {
                                
                                if (nextSibling) {
                                        nextSibling.textContent = '\u200B';
+                                       console.log("this");
                                }
                                else {
                                        node.parentNode.appendChild(document.createTextNode('\u200B'));
+                                       console.log("this");
                                }
                        }
                }