From: Joshua Rüsweg <josh@bastelstu.be>
Date: Sun, 22 Jul 2018 19:34:24 +0000 (+0200)
Subject: Close reactionPopover on clicking somewhere in the document
X-Git-Tag: 5.2.0_Alpha_1~364^2~101^2~65
X-Git-Url: https://git.stricted.de/?a=commitdiff_plain;h=ee92f5c1861493356b36b9437aa76728ec99786c;p=GitHub%2FWoltLab%2FWCF.git

Close reactionPopover on clicking somewhere in the document
See #2508
---

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 c541dda78d..a042922c09 100644
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js
@@ -11,13 +11,14 @@ define(
 	[
 		'Ajax',      'Core',                     'Dictionary',         'Language',
 		'ObjectMap', 'StringUtil',               'Dom/ChangeListener', 'Dom/Util',
-		'Ui/Dialog', 'WoltLabSuite/Core/Ui/User/List', 'User', 'WoltLabSuite/Core/Ui/Reaction/CountButtons', 'Ui/Alignment'
+		'Ui/Dialog', 'WoltLabSuite/Core/Ui/User/List', 'User', 'WoltLabSuite/Core/Ui/Reaction/CountButtons', 
+		'Ui/Alignment', 'Ui/CloseOverlay'
 	],
 	function(
 		Ajax,        Core,              Dictionary,           Language,
 		ObjectMap,   StringUtil,        DomChangeListener,    DomUtil,
 		UiDialog,    UiUserList,        User,                 CountButtons, 
-		UiAlignment
+		UiAlignment, UiCloseOverlay
 	)
 	{
 		"use strict";
@@ -68,6 +69,7 @@ define(
 				this.countButtons = new CountButtons(this._objectType, this._options); 
 				
 				DomChangeListener.add('WoltLabSuite/Core/Ui/Reaction/Handler-' + objectType, this.initReactButtons.bind(this));
+				UiCloseOverlay.add('WoltLabSuite/Core/Ui/Reaction/Handler', this._closePopover.bind(this));
 			},
 			
 			/**
@@ -120,7 +122,10 @@ define(
 			 * @param       {Element}       element
 			 */
 			_toggleReactPopover: function(objectId, element, event) {
-				event.preventDefault();
+				if (event !== null) {
+					event.preventDefault();
+					event.stopPropagation();
+				}
 				
 				if (this._popoverCurrentObjectId === 0 || this._popoverCurrentObjectId !== objectId) {
 					this._openReactPopover(objectId, element);
@@ -219,13 +224,16 @@ define(
 			 * Closes the react popover. 
 			 */
 			_closePopover: function(objectId, element) {
-				this._popoverCurrentObjectId = 0;
-				this._getPopover().classList.remove('active');
-				
-				if (this._options.isButtonGroupNavigation) {
-					// find nav element
-					var nav = element.closest('nav');
-					nav.style.cssText = "";
+				if (this._popoverCurrentObjectId !== 0) {
+					this._getPopover().classList.remove('active');
+					
+					if (this._options.isButtonGroupNavigation) {
+						// find nav element
+						var nav = this._containers.get(this._popoverCurrentObjectId).reactButton.closest('nav');
+						nav.style.cssText = "";
+					}
+					
+					this._popoverCurrentObjectId = 0;
 				}
 			},