From: Alexander Ebert <ebert@woltlab.com>
Date: Tue, 13 Sep 2016 09:27:50 +0000 (+0200)
Subject: Scroll codebox back into view after collapsing
X-Git-Tag: 3.0.0_Beta_1~197
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=cc275270af6fbd3e52c9a4abf80ce1b35fbd9f44;p=GitHub%2FWoltLab%2FWCF.git

Scroll codebox back into view after collapsing
---

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Bbcode/Collapsible.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Bbcode/Collapsible.js
index 0c217a11da..464372e222 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Bbcode/Collapsible.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Bbcode/Collapsible.js
@@ -14,7 +14,7 @@ define([], function() {
 	/**
 	 * @exports	WoltLabSuite/Core/Bbcode/Collapsible
 	 */
-	var BbcodeCollapsible = {
+	return {
 		observe: function() {
 			var container, toggleButton;
 			while (_containers.length) {
@@ -28,9 +28,20 @@ define([], function() {
 				
 				(function(container, toggleButton) {
 					var toggle = function() {
-						var expand = container.classList.contains('collapsed');
-						container.classList[expand ? 'remove' : 'add']('collapsed');
-						toggleButton.textContent = elData(toggleButton, 'title-' + (expand ? 'collapse' : 'expand'));
+						if (container.classList.toggle('collapsed')) {
+							toggleButton.textContent = elData(toggleButton, 'title-expand');
+							
+							// negative top value means the upper boundary is not within the viewport
+							var top = container.getBoundingClientRect().top;
+							if (top < 0) {
+								var y = window.pageYOffset + (top - 100);
+								if (y < 0) y = 0;
+								window.scrollTo(window.pageXOffset, y);
+							}
+						}
+						else {
+							toggleButton.textContent = elData(toggleButton, 'title-collapse');
+						}
 					};
 					
 					toggleButton.addEventListener(WCF_CLICK_EVENT, toggle);
@@ -51,6 +62,4 @@ define([], function() {
 			}
 		}
 	};
-	
-	return BbcodeCollapsible;
 });