Added work-around for calculation bug in Firefox

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Code.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Code.js
index a52131014295df97edf655c3b9a1d98937863487..e3c209a9e2a27354452ad5ea466a8a5221ffc331 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Code.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Code.js
@@ -6,7 +6,7 @@
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module      WoltLabSuite/Core/Ui/Redactor/Code
  */
-define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog'], function (EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog) {
+define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog', './PseudoHeader'], function (EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog, UiRedactorPseudoHeader) {
        "use strict";
        
        var _headerHeight = 0;
@@ -82,12 +82,7 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                        var pre = event.currentTarget;
                        
                        if (_headerHeight === 0) {
-                               _headerHeight = ~~window.getComputedStyle(pre).paddingTop.replace(/px$/, '');
-                               
-                               var styles = window.getComputedStyle(pre, '::before');
-                               _headerHeight += ~~styles.paddingTop.replace(/px$/, '');
-                               _headerHeight += ~~styles.height.replace(/px$/, '');
-                               _headerHeight += ~~styles.paddingBottom.replace(/px$/, '');
+                               _headerHeight = UiRedactorPseudoHeader.getHeight(pre);
                        }
                        
                        // check if the click hit the header

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/PseudoHeader.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/PseudoHeader.js
new file mode 100644 (file)
index 0000000..c60a5e2
--- /dev/null
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/PseudoHeader.js
@@ -0,0 +1,46 @@
+/**
+ * Helper class to deal with clickable block headers using the pseudo
+ * `::before` element.
+ * 
+ * @author      Alexander Ebert
+ * @copyright   2001-2016 WoltLab GmbH
+ * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
+ * @module      WoltLabSuite/Core/Ui/Redactor/PseudoHeader
+ */
+define([], function() {
+       "use strict";
+       
+       return {
+               /**
+                * Returns the height within a click should be treated as a click
+                * within the block element's title. This method expects that the
+                * `::before` element is used and that removing the attribute
+                * `data-title` does cause the title to collapse.
+                * 
+                * @param       {Element}       element         block element
+                * @return      {int}           clickable height spanning from the top border down to the bottom of the title
+                */
+               getHeight: function (element) {
+                       var height = ~~window.getComputedStyle(element).paddingTop.replace(/px$/, '');
+                       
+                       var styles = window.getComputedStyle(element, '::before');
+                       height += ~~styles.paddingTop.replace(/px$/, '');
+                       height += ~~styles.paddingBottom.replace(/px$/, '');
+                       
+                       var titleHeight = ~~styles.height.replace(/px$/, '');
+                       if (titleHeight === 0) {
+                               // firefox returns garbage for pseudo element height
+                               // https://bugzilla.mozilla.org/show_bug.cgi?id=925694#c7
+                               
+                               titleHeight = element.scrollHeight;
+                               element.classList.add('redactorCalcHeight');
+                               titleHeight -= element.scrollHeight;
+                               element.classList.remove('redactorCalcHeight');
+                       }
+                       
+                       height += titleHeight;
+                       
+                       return height;
+               }
+       }
+});

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Quote.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Quote.js
index f5609ad0a3558959f72436361b802b8e0b307e33..6e3ed0e9a6986252fd0f899c16d9fdafb0c437af 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Quote.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Quote.js
@@ -6,7 +6,7 @@
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module      WoltLabSuite/Core/Ui/Redactor/Quote
  */
-define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog'], function (Core, EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog) {
+define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog', './PseudoHeader'], function (Core, EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog, UiRedactorPseudoHeader) {
        "use strict";
        
        var _headerHeight = 0;
@@ -26,6 +26,7 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                 */
                init: function(editor, button) {
                        this._quote = null;
+                       this._quotes = elByTag('woltlab-quote', editor.$editor[0]);
                        this._editor = editor;
                        this._elementId = this._editor.$element[0].id;
                        
@@ -77,7 +78,6 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                        
                        this._editor.selection.restore();
                        var content = data.content;
-                       console.debug(data);
                        if (data.isText) {
                                content = StringUtil.escapeHTML(content);
                                content = '<p>' + content + '</p>';
@@ -118,10 +118,13 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                 * @protected
                 */
                _observeLoad: function() {
-                       elBySelAll('woltlab-quote', this._editor.$editor[0], (function(quote) {
+                       var quote;
+                       for (var i = 0, length = this._quotes.length; i < length; i++) {
+                               quote = this._quotes[i];
+                               
                                quote.addEventListener(WCF_CLICK_EVENT, this._callbackEdit);
                                this._setTitle(quote);
-                       }).bind(this));
+                       }
                },
                
                /**
@@ -134,12 +137,7 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                        var quote = event.currentTarget;
                        
                        if (_headerHeight === 0) {
-                               _headerHeight = ~~window.getComputedStyle(quote).paddingTop.replace(/px$/, '');
-                               
-                               var styles = window.getComputedStyle(quote, '::before');
-                               _headerHeight += ~~styles.paddingTop.replace(/px$/, '');
-                               _headerHeight += ~~styles.height.replace(/px$/, '');
-                               _headerHeight += ~~styles.paddingBottom.replace(/px$/, '');
+                               _headerHeight = UiRedactorPseudoHeader.getHeight(quote);
                        }
                        
                        // check if the click hit the header

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Spoiler.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Spoiler.js
index 5d6f9438e6868bd68fd680ea1c33e23706a33bd9..744f1d4c566261bd5098e8b652177b7796be8f05 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Spoiler.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Spoiler.js
@@ -6,7 +6,7 @@
  * @license     GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module      WoltLabSuite/Core/Ui/Redactor/Spoiler
  */
-define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog'], function (EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog) {
+define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Dialog', './PseudoHeader'], function (EventHandler, EventKey, Language, StringUtil, DomUtil, UiDialog, UiRedactorPseudoHeader) {
        "use strict";
        
        var _headerHeight = 0;
@@ -80,12 +80,7 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                        var spoiler = event.currentTarget;
                        
                        if (_headerHeight === 0) {
-                               _headerHeight = ~~window.getComputedStyle(spoiler).paddingTop.replace(/px$/, '');
-                               
-                               var styles = window.getComputedStyle(spoiler, '::before');
-                               _headerHeight += ~~styles.paddingTop.replace(/px$/, '');
-                               _headerHeight += ~~styles.height.replace(/px$/, '');
-                               _headerHeight += ~~styles.paddingBottom.replace(/px$/, '');
+                               _headerHeight = UiRedactorPseudoHeader.getHeight(spoiler);
                        }
                        
                        // check if the click hit the header

diff --git a/wcfsetup/install/files/style/bbcode/code.scss b/wcfsetup/install/files/style/bbcode/code.scss
index bc538c11a65e80651c1313ac511236efdf1791fe..013cca6d77432c841527fd042ced25f1b20a53dd 100644 (file)
--- a/wcfsetup/install/files/style/bbcode/code.scss
+++ b/wcfsetup/install/files/style/bbcode/code.scss
@@ -9,7 +9,7 @@
        position: relative;
        white-space: pre;
        
-       &::before {
+       &:not(.redactorCalcHeight)::before {
                content: attr(data-title);
                cursor: pointer;
                display: block;

diff --git a/wcfsetup/install/files/style/bbcode/quote.scss b/wcfsetup/install/files/style/bbcode/quote.scss
index b2067899fa053665464f8fe77b7a28dcfb40948d..ecaca39238703519e843543384e53e84773f4dcc 100644 (file)
--- a/wcfsetup/install/files/style/bbcode/quote.scss
+++ b/wcfsetup/install/files/style/bbcode/quote.scss
@@ -21,7 +21,7 @@ woltlab-quote,
        }
 }
 
-woltlab-quote::before {
+woltlab-quote:not(.redactorCalcHeight)::before {
        content: attr(data-title);
        cursor: pointer;
        display: block;

diff --git a/wcfsetup/install/files/style/bbcode/spoiler.scss b/wcfsetup/install/files/style/bbcode/spoiler.scss
index 9792c1aaad3e21aba982d9f59f2f189dbca70c6b..275ee9660bcafe2ff13edc6bf2fdfbd8d657addc 100644 (file)
--- a/wcfsetup/install/files/style/bbcode/spoiler.scss
+++ b/wcfsetup/install/files/style/bbcode/spoiler.scss
@@ -7,7 +7,7 @@
        padding: 10px 20px;
        position: relative;
        
-       &::before {
+       &:not(.redactorCalcHeight)::before {
                content: attr(data-title);
                cursor: pointer;
                display: block;