From 3fe98bbdb2d66fbfad6df1a98491e7f688dc9086 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Joshua=20R=C3=BCsweg?= <josh@bastelstu.be>
Date: Sat, 28 Jul 2018 11:38:49 +0200
Subject: [PATCH] Sort reactions by showOrder in frontend See #2508

---
 .../WoltLabSuite/Core/Ui/Reaction/Handler.js  | 30 +++++++++++++++----
 .../system/reaction/ReactionHandler.class.php |  4 ++-
 2 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
index a042922c09..e3bc33cccd 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
@@ -180,14 +180,16 @@ define(
 					
 					var popoverContentHTML = elCreate('ul');
 					
-					for (var key in REACTION_TYPES) {
-						if (!REACTION_TYPES.hasOwnProperty(key)) continue;
+					var sortedReactionTypes = this._getSortedReactionTypes();
+					
+					for (var key in sortedReactionTypes) {
+						if (!sortedReactionTypes.hasOwnProperty(key)) continue;
 						
-						var reactionType = REACTION_TYPES[key];
+						var reactionType = sortedReactionTypes[key];
 						
 						var reactionTypeItem = elCreate('li');
 						reactionTypeItem.className = 'reactionTypeButton jsTooltip';
-						elData(reactionTypeItem, 'reaction-type-id', key);
+						elData(reactionTypeItem, 'reaction-type-id', reactionType.reactionTypeID);
 						elData(reactionTypeItem, 'title', reactionType.title);
 						reactionTypeItem.title = reactionType.title;
 						
@@ -220,10 +222,28 @@ define(
 				return this._popover; 
 			},
 			
+			/**
+			 * Sort the reaction types by the showOrder field. 
+			 * 
+			 * @returns     {Array}         the reaction types sorted by showOrder
+			 */
+			_getSortedReactionTypes: function() {
+				var sortedReactionTypes = [];
+				
+				for (var key in REACTION_TYPES) {
+					if (!REACTION_TYPES.hasOwnProperty(key)) continue;
+					var reactionType = REACTION_TYPES[key];
+					
+					sortedReactionTypes[reactionType.showOrder] = reactionType;
+				}
+				
+				return sortedReactionTypes;
+			},
+			
 			/**
 			 * Closes the react popover. 
 			 */
-			_closePopover: function(objectId, element) {
+			_closePopover: function() {
 				if (this._popoverCurrentObjectId !== 0) {
 					this._getPopover().classList.remove('active');
 					
diff --git a/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php b/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php
index 0b220ee0a4..b62f1c666a 100644
--- a/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php
+++ b/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php
@@ -70,7 +70,9 @@ class ReactionHandler extends SingletonFactory {
 			$returnValues[$reaction->reactionTypeID] = [
 				'title' => $reaction->getTitle(), 
 				'renderedIcon' => $reaction->renderIcon(), 
-				'iconPath' => $reaction->getIconPath()
+				'iconPath' => $reaction->getIconPath(), 
+				'showOrder' => $reaction->showOrder, 
+				'reactionTypeID' => $reaction->reactionTypeID
 			];
 		}
 		
-- 
2.20.1