From 91c72fa83a6d1f5152f9f709c3155b322cc9eee9 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Joshua=20R=C3=BCsweg?= Date: Tue, 19 Jun 2018 16:03:21 +0200 Subject: [PATCH] Drop support for icon reactionTypes Unfortunately, FontAwesome offers too few possibilities to create good reactions. Therefore, we decided to remove support for FontAwesome in reactions. This makes it easier to develop the system stably and fewer use cases have to be considered. See #2508 --- .../templates/reactionTypeIcon.tpl | 5 -- .../WoltLabSuite/Core/Ui/Reaction/Handler.js | 6 ++- .../data/reaction/type/ReactionType.class.php | 54 +++++-------------- .../system/reaction/ReactionHandler.class.php | 1 + .../install/files/style/ui/reactions.scss | 33 ------------ wcfsetup/setup/db/install.sql | 5 +- 6 files changed, 18 insertions(+), 86 deletions(-) delete mode 100644 com.woltlab.wcf/templates/reactionTypeIcon.tpl diff --git a/com.woltlab.wcf/templates/reactionTypeIcon.tpl b/com.woltlab.wcf/templates/reactionTypeIcon.tpl deleted file mode 100644 index c256d3f9ba..0000000000 --- a/com.woltlab.wcf/templates/reactionTypeIcon.tpl +++ /dev/null @@ -1,5 +0,0 @@ - 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 723941a51b..c541dda78d 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/Handler.js @@ -255,13 +255,15 @@ define( this._containers.get(data.returnValues.objectID).reactButton.classList.add('active'); // update icon - this._containers.get(data.returnValues.objectID).reactButton.innerHTML = REACTION_TYPES[data.returnValues.reactionTypeID].renderedIcon; + elBySel('img', this._containers.get(data.returnValues.objectID).reactButton).src = REACTION_TYPES[data.returnValues.reactionTypeID].iconPath; + elData(elBySel('img', this._containers.get(data.returnValues.objectID).reactButton), 'reaction-type-id', data.returnValues.reactionTypeID); } else { this._containers.get(data.returnValues.objectID).reactButton.classList.remove('active'); // update icon - this._containers.get(data.returnValues.objectID).reactButton.innerHTML = ''; + elBySel('img', this._containers.get(data.returnValues.objectID).reactButton).src = WCF_PATH+'images/reaction/reactionIcon.svg'; + elData(elBySel('img', this._containers.get(data.returnValues.objectID).reactButton), 'reaction-type-id', 0); } }, diff --git a/wcfsetup/install/files/lib/data/reaction/type/ReactionType.class.php b/wcfsetup/install/files/lib/data/reaction/type/ReactionType.class.php index 68a0a2cf78..c71ecf3368 100644 --- a/wcfsetup/install/files/lib/data/reaction/type/ReactionType.class.php +++ b/wcfsetup/install/files/lib/data/reaction/type/ReactionType.class.php @@ -18,10 +18,7 @@ use wcf\system\WCF; * @property-read string $title * @property-read integer $type type of the reaction (1 is positive, 0 is neutral and -1 is negative) * @property-read integer $showOrder position of the reaction type in relation to the other reaction types - * @property-read integer $iconType the icon type of the reaction * @property-read string $iconFile the file location of the icon - * @property-read string $iconName the icon name - * @property-read string $iconColor the icon color * @property-read integer $isDisabled is `1` if the reaction type is disabled and thus not shown, otherwise `0` */ class ReactionType extends DatabaseObject implements ITitledObject { @@ -43,18 +40,6 @@ class ReactionType extends DatabaseObject implements ITitledObject { */ const REACTION_TYPE_NEGATIVE = -1; - /** - * The iconType value, if this reaction type is an image. - * @var integer - */ - const ICON_TYPE_IMAGE = 1; - - /** - * The iconType value, if this reaction type is a font icon. - * @var integer - */ - const ICON_TYPE_ICON = 2; - /** * @inheritDoc */ @@ -73,33 +58,18 @@ class ReactionType extends DatabaseObject implements ITitledObject { * @return string */ public function renderIcon(): string { - switch ($this->iconType) { - case self::ICON_TYPE_ICON: - return WCF::getTPL()->fetch('reactionTypeIcon', 'wcf', [ - 'reactionType' => $this - ], true); - break; - - case self::ICON_TYPE_IMAGE: - return WCF::getTPL()->fetch('reactionTypeImage', 'wcf', [ - 'reactionType' => $this - ], true); - break; - - default: - $parameters = [ - 'renderedTemplate' => null - ]; - - EventHandler::getInstance()->fireAction($this, 'renderIcon', $parameters); - - if ($parameters['renderedTemplate']) { - return $parameters['renderedTemplate']; - } - - throw new \LogicException("Unable to render the reaction type icon with the type '". $this->type ."'."); - break; - } + return WCF::getTPL()->fetch('reactionTypeImage', 'wcf', [ + 'reactionType' => $this + ], true); + } + + /** + * Returns the url to the icon for this reaction. + * + * @return string + */ + public function getIconPath(): string { + return WCF::getPath() . 'images/reaction/'. $this->iconFile; } /** diff --git a/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php b/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php index 903ce67ec5..c68c2ae0ea 100644 --- a/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php +++ b/wcfsetup/install/files/lib/system/reaction/ReactionHandler.class.php @@ -67,6 +67,7 @@ class ReactionHandler extends SingletonFactory { $returnValues[$reaction->reactionTypeID] = [ 'title' => $reaction->getTitle(), 'renderedIcon' => $reaction->renderIcon(), + 'iconPath' => $reaction->getIconPath() ]; } diff --git a/wcfsetup/install/files/style/ui/reactions.scss b/wcfsetup/install/files/style/ui/reactions.scss index 1c5a32f604..71da038dca 100644 --- a/wcfsetup/install/files/style/ui/reactions.scss +++ b/wcfsetup/install/files/style/ui/reactions.scss @@ -30,13 +30,6 @@ img.reactionType { height: 24px; } -span.icon.reactionType { - font-size: 18px; - height: 24px; - line-height: 24px; - width: 24px; -} - .reactionPopoverContent { background-color: $wcfContentBackground; border-radius: 3px; @@ -55,17 +48,6 @@ span.icon.reactionType { transform: scale(1.2); } - > ul > li.reactionTypeButton > span.icon:hover { - font-size: 22px; - height: 24px; - line-height: 24px; - width: 24px; - } - - > ul > li.reactionTypeButton > span.icon { - cursor: pointer; - } - @include screen-md-down { > ul > li.reactionTypeButton { margin: 0px; @@ -117,14 +99,6 @@ li.reactCountButton:hover { height: 16px; } - li.reactCountButton > span.icon.reactionType { - font-size: 14px; - height: 16px; - line-height: 16px; - width: 16px; - cursor: pointer; - } - span.reactionCount { @include wcfFontSmall; } @@ -140,11 +114,4 @@ ul.buttonList.iconList { width: 16px; height: 16px; } - - span.icon.reactionType { - font-size: 14px; - height: 16px; - line-height: 16px; - width: 16px; - } } \ No newline at end of file diff --git a/wcfsetup/setup/db/install.sql b/wcfsetup/setup/db/install.sql index 379409994c..2622109b46 100644 --- a/wcfsetup/setup/db/install.sql +++ b/wcfsetup/setup/db/install.sql @@ -1163,10 +1163,7 @@ CREATE TABLE wcf1_reaction_type( title VARCHAR(255), type TINYINT(1), showOrder INT(10) NOT NULL DEFAULT 0, - iconType TINYINT(1) DEFAULT 1, - iconFile MEDIUMTEXT, - iconName VARCHAR(255), - iconColor VARCHAR(255), + iconFile MEDIUMTEXT, isDisabled TINYINT(1) NOT NULL DEFAULT 0 ); -- 2.20.1