From 6dd8a65bcf0c79cfd63114f78cd1ba68f8568a09 Mon Sep 17 00:00:00 2001
From: Matthias Schmidt <gravatronics@live.com>
Date: Sun, 26 Jan 2020 10:21:39 +0100
Subject: [PATCH] Fix smilies in wysiwyg form container for multiple smiley
 categories

---
 .../__wysiwygSmileyFormContainer.tpl          |  8 +++-
 .../__wysiwygSmileyFormContainer.tpl          |  8 +++-
 wcfsetup/install/files/js/WCF.Message.js      | 43 +++++++++++++++----
 .../WysiwygSmileyFormContainer.class.php      | 16 ++++---
 .../wysiwyg/WysiwygSmileyFormNode.class.php   | 11 +----
 5 files changed, 61 insertions(+), 25 deletions(-)

diff --git a/com.woltlab.wcf/templates/__wysiwygSmileyFormContainer.tpl b/com.woltlab.wcf/templates/__wysiwygSmileyFormContainer.tpl
index 4a6df1a9ee..f92b85c8c8 100644
--- a/com.woltlab.wcf/templates/__wysiwygSmileyFormContainer.tpl
+++ b/com.woltlab.wcf/templates/__wysiwygSmileyFormContainer.tpl
@@ -3,7 +3,13 @@
 <script data-relocate="true">
 	$(function() {
 		{if $container->children()|count > 1}
-			new WCF.Message.SmileyCategories('{@$container->getPrefixedWysiwygId()}');
+			new WCF.Message.SmileyCategories(
+				'{@$container->getPrefixedWysiwygId()}',
+				'{@$container->getPrefixedId()}Container',
+				true
+			);
+			
+			$('#{@$container->getPrefixedId()}Container').messageTabMenu();
 		{/if}
 		
 		require(['WoltLabSuite/Core/Ui/Smiley/Insert'], function(UiSmileyInsert) {
diff --git a/wcfsetup/install/files/acp/templates/__wysiwygSmileyFormContainer.tpl b/wcfsetup/install/files/acp/templates/__wysiwygSmileyFormContainer.tpl
index 4a6df1a9ee..f92b85c8c8 100644
--- a/wcfsetup/install/files/acp/templates/__wysiwygSmileyFormContainer.tpl
+++ b/wcfsetup/install/files/acp/templates/__wysiwygSmileyFormContainer.tpl
@@ -3,7 +3,13 @@
 <script data-relocate="true">
 	$(function() {
 		{if $container->children()|count > 1}
-			new WCF.Message.SmileyCategories('{@$container->getPrefixedWysiwygId()}');
+			new WCF.Message.SmileyCategories(
+				'{@$container->getPrefixedWysiwygId()}',
+				'{@$container->getPrefixedId()}Container',
+				true
+			);
+			
+			$('#{@$container->getPrefixedId()}Container').messageTabMenu();
 		{/if}
 		
 		require(['WoltLabSuite/Core/Ui/Smiley/Insert'], function(UiSmileyInsert) {
diff --git a/wcfsetup/install/files/js/WCF.Message.js b/wcfsetup/install/files/js/WCF.Message.js
index 61b641d262..61db667a70 100644
--- a/wcfsetup/install/files/js/WCF.Message.js
+++ b/wcfsetup/install/files/js/WCF.Message.js
@@ -622,13 +622,15 @@ if (COMPILER_TARGET_DEFAULT) {
 		 *
 		 * @param        string                wysiwygSelector
 		 */
-		init: function (wysiwygSelector) {
+		init: function (wysiwygSelector, smiliesTabMenuId, formBuilderUsage) {
 			this._proxy = new WCF.Action.Proxy({
 				success: $.proxy(this._success, this)
 			});
 			this._wysiwygSelector = wysiwygSelector;
+			this._smiliesTabMenuId = smiliesTabMenuId || 'smilies-' + this._wysiwygSelector;
+			this._formBuilderUsage = formBuilderUsage || false;
 			
-			$('#smilies-' + this._wysiwygSelector).on('messagetabmenushow', $.proxy(this._click, this));
+			$('#' + this._smiliesTabMenuId).on('messagetabmenushow', $.proxy(this._click, this));
 		},
 		
 		/**
@@ -640,10 +642,30 @@ if (COMPILER_TARGET_DEFAULT) {
 		_click: function (event, data) {
 			event.preventDefault();
 			
-			var $categoryID = parseInt(data.activeTab.tab.data('smileyCategoryID'));
+			if (this._formBuilderUsage) {
+				var href = data.activeTab.tab.children('a').prop('href');
+				if (href.match(/#([a-zA-Z0-9_-]+)$/)) {
+					var anchor = RegExp.$1;
+					
+					if (anchor.match(this._smiliesTabMenuId.replace(/Container$/, '') + '_smileyCategoryTab(\\d+)Container')) {
+						var categoryID = parseInt(RegExp.$1);
+					}
+					else {
+						console.debug("[WCF.Message.SmileyCategories] Cannot extract category id for tab '" + data.activeTab.tab.wcfIdentify() + "'.");
+						return;
+					}
+				}
+				else {
+					console.debug("[WCF.Message.SmileyCategories] Cannot extract category id for tab '" + data.activeTab.tab.wcfIdentify() + "'.");
+					return;
+				}
+			}
+			else {
+				var categoryID = parseInt(data.activeTab.tab.data('smileyCategoryID'));
+			}
 			
 			// ignore global category, will always be pre-loaded
-			if (!$categoryID) {
+			if (!categoryID) {
 				return;
 			}
 			
@@ -653,8 +675,8 @@ if (COMPILER_TARGET_DEFAULT) {
 			}
 			
 			// cache exists
-			if (this._cache[$categoryID] !== undefined) {
-				data.activeTab.container.html(this._cache[$categoryID]);
+			if (this._cache[categoryID] !== undefined) {
+				data.activeTab.container.html(this._cache[categoryID]);
 				return;
 			}
 			
@@ -662,7 +684,7 @@ if (COMPILER_TARGET_DEFAULT) {
 			this._proxy.setOption('data', {
 				actionName: 'getSmilies',
 				className: 'wcf\\data\\smiley\\category\\SmileyCategoryAction',
-				objectIDs: [$categoryID]
+				objectIDs: [categoryID]
 			});
 			this._proxy.sendRequest();
 		},
@@ -678,7 +700,12 @@ if (COMPILER_TARGET_DEFAULT) {
 			var $categoryID = parseInt(data.returnValues.smileyCategoryID);
 			this._cache[$categoryID] = data.returnValues.template;
 			
-			$('#smilies-' + this._wysiwygSelector + '-' + $categoryID).html(data.returnValues.template);
+			if (this._formBuilderUsage) {
+				$('#' + this._smiliesTabMenuId.replace(/Container$/, '') + '_smileyCategoryTab' + $categoryID + 'Container').html(data.returnValues.template);
+			}
+			else {
+				$('#smilies-' + this._wysiwygSelector + '-' + $categoryID).html(data.returnValues.template);
+			}
 		}
 	});
 	
diff --git a/wcfsetup/install/files/lib/system/form/builder/container/wysiwyg/WysiwygSmileyFormContainer.class.php b/wcfsetup/install/files/lib/system/form/builder/container/wysiwyg/WysiwygSmileyFormContainer.class.php
index f80198aef3..5db3118fb8 100644
--- a/wcfsetup/install/files/lib/system/form/builder/container/wysiwyg/WysiwygSmileyFormContainer.class.php
+++ b/wcfsetup/install/files/lib/system/form/builder/container/wysiwyg/WysiwygSmileyFormContainer.class.php
@@ -31,8 +31,7 @@ class WysiwygSmileyFormContainer extends TabTabMenuFormContainer {
 	 */
 	public function __construct() {
 		$this->attribute('data-preselect', 'true')
-			->attribute('data-collapsible', 'false')
-			->useAnchors(false);
+			->attribute('data-collapsible', 'false');
 	}
 	
 	/**
@@ -41,11 +40,18 @@ class WysiwygSmileyFormContainer extends TabTabMenuFormContainer {
 	public function populate() {
 		parent::populate();
 		
-		$smileyCategories = SmileyCache::getInstance()->getCategories();
+		$smileyCategories = array_values(SmileyCache::getInstance()->getCategories());
 		
-		foreach ($smileyCategories as $smileyCategory) {
+		foreach ($smileyCategories as $index => $smileyCategory) {
 			$smileyCategory->loadSmilies();
 			if (count($smileyCategory) > 0) {
+				// all of the smilies not in the first category are loaded via
+				// JavaScript
+				$smilies = [];
+				if (!$index) {
+					$smilies = SmileyCache::getInstance()->getCategorySmilies($smileyCategory->categoryID ?: null);
+				}
+				
 				$this->appendChild(
 					TabFormContainer::create($this->getId() . '_smileyCategoryTab' . $smileyCategory->categoryID)
 						->label(StringUtil::encodeHTML($smileyCategory->getTitle()))
@@ -56,7 +62,7 @@ class WysiwygSmileyFormContainer extends TabTabMenuFormContainer {
 								->removeClass('section')
 								->appendChild(
 									WysiwygSmileyFormNode::create($this->getId() . '_smileyCategory' . $smileyCategory->categoryID)
-										->smilies(SmileyCache::getInstance()->getCategorySmilies($smileyCategory->categoryID ?: null))
+										->smilies($smilies)
 								)
 						)
 				);
diff --git a/wcfsetup/install/files/lib/system/form/builder/wysiwyg/WysiwygSmileyFormNode.class.php b/wcfsetup/install/files/lib/system/form/builder/wysiwyg/WysiwygSmileyFormNode.class.php
index 46b419f7ef..15c81ebfb8 100644
--- a/wcfsetup/install/files/lib/system/form/builder/wysiwyg/WysiwygSmileyFormNode.class.php
+++ b/wcfsetup/install/files/lib/system/form/builder/wysiwyg/WysiwygSmileyFormNode.class.php
@@ -20,9 +20,7 @@ use wcf\system\WCF;
  */
 class WysiwygSmileyFormNode implements IFormChildNode {
 	use TFormChildNode;
-	use TFormNode {
-		isAvailable as traitIsAvailable;
-	}
+	use TFormNode;
 	
 	/**
 	 * list of available smilies
@@ -55,13 +53,6 @@ class WysiwygSmileyFormNode implements IFormChildNode {
 		return false;
 	}
 	
-	/**
-	 * @inheritDoc
-	 */
-	public function isAvailable() {
-		return $this->traitIsAvailable() && !empty($this->smilies);
-	}
-	
 	/**
 	 * @inheritDoc
 	 */
-- 
2.20.1