From: Alexander Ebert <ebert@woltlab.com>
Date: Tue, 6 Sep 2016 20:21:54 +0000 (+0200)
Subject: Improved inline format
X-Git-Tag: 3.0.0_Beta_1~280
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=121dea6b243570832941f25b3e0010448a0e1b8f;p=GitHub%2FWoltLab%2FWCF.git

Improved inline format
---

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabColor.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabColor.js
index 6e93007fec..3e0a27b9b1 100644
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabColor.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabColor.js
@@ -44,18 +44,26 @@ $.Redactor.prototype.WoltLabColor = function() {
 		setColor: function(key) {
 			key = key.replace(/^color_/, '');
 			
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.format(this.$editor[0], 'woltlab-color', 'woltlab-color-' + key);
+				
+				this.buffer.set();
 			}).bind(this));
 		},
 		
 		removeColor: function() {
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.removeFormat(this.$editor[0], 'woltlab-color');
+				
+				this.buffer.set();
 			}).bind(this));
 		}
 	};
diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFont.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFont.js
index dcc216fdbd..55ab6f647f 100644
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFont.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFont.js
@@ -35,18 +35,26 @@ $.Redactor.prototype.WoltLabFont = function() {
 		},
 		
 		setFont: function(key) {
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.format(this.$editor[0], 'woltlab-font', 'woltlab-font-' + key);
+				
+				this.buffer.set();
 			}).bind(this));
 		},
 		
 		removeFont: function() {
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.removeFormat(this.$editor[0], 'woltlab-font');
+				
+				this.buffer.set();
 			}).bind(this));
 		}
 	};
diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabSize.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabSize.js
index fd42c5c19e..d517e8fac3 100644
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabSize.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabSize.js
@@ -31,22 +31,29 @@ $.Redactor.prototype.WoltLabSize = function() {
 					link.parentNode.classList.add('woltlab-size-selection');
 				}
 			});
-			
 		},
 		
 		setSize: function(key) {
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.format(this.$editor[0], 'woltlab-size', 'woltlab-size-' + key.replace(/^size_/, ''));
+				
+				this.buffer.set();
 			}).bind(this));
 		},
 		
 		removeSize: function() {
+			this.selection.save();
+			
 			require(['WoltLabSuite/Core/Ui/Redactor/Format'], (function(UiRedactorFormat) {
 				this.buffer.set();
 				
 				UiRedactorFormat.removeFormat(this.$editor[0], 'woltlab-size');
+				
+				this.buffer.set();
 			}).bind(this));
 		}
 	};
diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Format.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Format.js
index cbe2769187..0e2f77e800 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Format.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Format.js
@@ -48,7 +48,7 @@ define(['Dom/Util'], function(DomUtil) {
 				document.execCommand('strikethrough');
 			}
 			
-			var elements = elBySelAll('strike', editorElement), formatElement, property, strike;
+			var elements = elBySelAll('strike', editorElement), formatElement, property, selectElements = [], strike;
 			for (var i = 0, length = elements.length; i < length; i++) {
 				strike = elements[i];
 				
@@ -63,6 +63,31 @@ define(['Dom/Util'], function(DomUtil) {
 				}
 				
 				DomUtil.replaceElement(strike, formatElement);
+				selectElements.push(formatElement);
+			}
+			
+			var count = selectElements.length;
+			if (count) {
+				var firstSelectedElement = selectElements[0];
+				var lastSelectedElement = selectElements[count - 1];
+				
+				// check if parent is of the same format type
+				// and contains only the selected nodes
+				if (tmpElement === null && (firstSelectedElement.parentNode === lastSelectedElement.parentNode)) {
+					var parent = firstSelectedElement.parentNode;
+					if (parent.nodeName === tagName.toUpperCase()) {
+						if (this._isBoundaryElement(firstSelectedElement, parent, 'previous') && this._isBoundaryElement(lastSelectedElement, parent, 'next')) {
+							DomUtil.unwrapChildNodes(parent);
+						}
+					}
+				}
+				
+				range = document.createRange();
+				range.setStart(firstSelectedElement, 0);
+				range.setEnd(lastSelectedElement, lastSelectedElement.childNodes.length);
+				
+				selection.removeAllRanges();
+				selection.addRange(range);
 			}
 		},
 		
@@ -209,7 +234,7 @@ define(['Dom/Util'], function(DomUtil) {
 			}
 			
 			// the strike element is now some kind of isolated, meaning we can now safely
-			// remove all offending parent nodes without influcing formatting of any content
+			// remove all offending parent nodes without influencing formatting of any content
 			// before or after the element
 			var elements = elByTag(tagName, lastMatchingParent);
 			while (elements.length) {
@@ -240,6 +265,28 @@ define(['Dom/Util'], function(DomUtil) {
 			}
 			
 			return match;
+		},
+		
+		/**
+		 * Returns true if provided element is the first or last element
+		 * of its parent, ignoring empty text nodes appearing between the
+		 * element and the boundary.
+		 * 
+		 * @param       {Element}       element         target element
+		 * @param       {Element}       parent          parent element
+		 * @param       {string}        type            traversal direction, can be either `next` or `previous`
+		 * @return      {boolean}       true if element is the non-empty boundary element
+		 * @protected
+		 */
+		_isBoundaryElement: function (element, parent, type) {
+			var node = element;
+			while (node = node[type + 'Sibling']) {
+				if (node.nodeType !== Node.TEXT_NODE || node.textContent.replace(/\u200B/, '') !== '') {
+					return false;
+				}
+			}
+			
+			return true;
 		}
 	};
 });