Add basic reaction support to comments
authorJoshua Rüsweg <josh@bastelstu.be>
Tue, 19 Jun 2018 13:51:48 +0000 (15:51 +0200)
committerJoshua Rüsweg <josh@bastelstu.be>
Tue, 19 Jun 2018 13:51:48 +0000 (15:51 +0200)
See #2508

com.woltlab.wcf/templates/__commentJavaScript.tpl
com.woltlab.wcf/templates/commentList.tpl
com.woltlab.wcf/templates/commentResponseList.tpl
wcfsetup/install/files/lib/data/comment/StructuredCommentList.class.php
wcfsetup/install/files/lib/system/cache/builder/ReactionTypeCacheBuilder.class.php

index 51eeea8ffcbca2e3ea5b7bb986442dc55ab6290f..1c5973b0d8aabb3a6165ed593723d3b0b0ee89a7 100644 (file)
                
                new {if $commentHandlerClass|isset}{@$commentHandlerClass}{else}WCF.Comment.Handler{/if}('{$commentContainerID}');
                {if MODULE_LIKE && $commentList->getCommentManager()->supportsLike() && $__wcf->getSession()->getPermission('user.like.canViewLike')}
-                       require(['WoltLabSuite/Core/Ui/Like/Handler'], function(UiLikeHandler) {
+                       require(['WoltLabSuite/Core/Ui/Reaction/Handler'], function(UiReactionHandler) {
                                var canDislike = {if LIKE_ENABLE_DISLIKE}true{else}false{/if};
                                var canLike = {if $__wcf->getUser()->userID && $__wcf->getSession()->getPermission('user.like.canLike')}true{else}false{/if};
                                var canLikeOwnContent = {if LIKE_ALLOW_FOR_OWN_CONTENT}true{else}false{/if};
                                
-                               new UiLikeHandler('com.woltlab.wcf.comment', {
+                               new UiReactionHandler('com.woltlab.wcf.comment', {
                                        // settings
                                        badgeClassNames: 'separatorLeft',
                                        markListItemAsActive: true,
                                        canViewSummary: false,
                                        
                                        // selectors
-                                       badgeContainerSelector: '.commentContent:not(.commentResponseContent) > .containerHeadline > h3',
-                                       buttonAppendToSelector: '.commentContent .buttonList',
-                                       containerSelector: '.comment',
-                                       summarySelector: ''
+                                       containerSelector: 'li.comment',
+                                       summaryListSelector: '.reactionSummaryList',
+                                       isButtonGroupNavigation: true
                                });
                                
-                               new UiLikeHandler('com.woltlab.wcf.comment.response', {
+                               
+                               new UiReactionHandler('com.woltlab.wcf.comment.response', {
                                        // settings
                                        badgeClassNames: 'separatorLeft',
                                        markListItemAsActive: true,
                                        canViewSummary: false,
                                        
                                        // selectors
-                                       badgeContainerSelector: '.commentResponseContent > .containerHeadline > h3',
-                                       buttonAppendToSelector: '.commentContent .buttonList',
                                        containerSelector: '.commentResponse',
-                                       summarySelector: ''
+                                       summaryListSelector: '.reactionSummaryList',
+                                       isButtonGroupNavigation: true
                                });
                        });
                {/if}
index 010df3ee37be4c47a9f56b81a923fe6431885557..eb5d4edd607f887beee41371bf9934a0560360f7 100644 (file)
@@ -8,7 +8,7 @@
        {else}
                <li class="comment jsComment"
                    data-object-id="{@$comment->commentID}" data-comment-id="{@$comment->commentID}" data-object-type="com.woltlab.wcf.comment"
-                   data-like-liked="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->liked}{/if}" data-like-likes="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->likes}{else}0{/if}" data-like-dislikes="{if $likeData[comment][$comment->commentID]|isset}{@$likeData[comment][$comment->commentID]->dislikes}{else}0{/if}" data-like-users='{if $likeData[comment][$comment->commentID]|isset}{ {implode from=$likeData[comment][$comment->commentID]->getUsers() item=likeUser}"{@$likeUser->userID}": { "username": "{$likeUser->username|encodeJSON}" }{/implode} }{else}{ }{/if}'
+                       {@$__wcf->getReactionHandler()->getDataAttributes('com.woltlab.wcf.comment', $comment->commentID)}
                    data-can-edit="{if $comment->isEditable()}true{else}false{/if}" data-can-delete="{if $comment->isDeletable()}true{else}false{/if}"
                    data-responses="{@$comment->responses}" data-last-response-time="{if $commentLastResponseTime|empty}{@$comment->getLastResponseTime()}{else}{@$commentLastResponseTime}{/if}" data-user-id="{@$comment->userID}" data-is-disabled="{@$comment->isDisabled}">
                        <div class="box48">
@@ -36,6 +36,8 @@
                                                                
                                                                <small class="separatorLeft">{@$comment->time|time}</small>
                                                                
+                                                               {include file="reactionSummaryList" isTiny=true reactionData=$likeData[comment] objectType="com.woltlab.wcf.comment" objectID=$comment->commentID}
+                                                               
                                                                {if $comment->isDisabled}
                                                                        <span class="badge label green jsIconDisabled">{lang}wcf.message.status.disabled{/lang}</span>
                                                                {/if}
@@ -53,6 +55,7 @@
                                                                        <li class="jsReportCommentComment jsOnly" data-object-id="{@$comment->commentID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                                {/if}
                                                                
+                                                               <li class="jsOnly"><a href="#" class="reactButton jsTooltip" title="{lang}wcf.reactions.react{/lang}">{if $likeData[comment][$comment->commentID]|isset && $likeData[comment][$comment->commentID]->reactionTypeID}{@$__wcf->getReactionHandler()->getReactionTypeByID($likeData[comment][$comment->commentID]->reactionTypeID)->renderIcon()}{else}<img src="{$__wcf->getPath()}/images/reaction/reactionIcon.svg" class="reactionType">{/if} <span class="invisible">{lang}wcf.reactions.react{/lang}</span></a></li>
                                                                {event name='commentOptions'}
                                                        </ul>
                                                </nav>
index 1804e06e13864b783e8318d33316939409ef67f5..3819d55bd31416629397462f16c5eae30be88337 100644 (file)
@@ -4,7 +4,7 @@
                        <p class="info commentModerationDisabledComment">{lang}wcf.comment.moderation.disabledComment{/lang}</p>
                </li>
        {else}
-               <li class="commentResponse jsCommentResponse" data-object-id="{@$response->responseID}" data-response-id="{@$response->responseID}" data-object-type="com.woltlab.wcf.comment.response" data-like-liked="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->liked}{/if}" data-like-likes="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->likes}{else}0{/if}" data-like-dislikes="{if $likeData[response][$response->responseID]|isset}{@$likeData[response][$response->responseID]->dislikes}{else}0{/if}" data-like-users='{if $likeData[response][$response->responseID]|isset}{ {implode from=$likeData[response][$response->responseID]->getUsers() item=likeUser}"{@$likeUser->userID}": { "username": "{$likeUser->username|encodeJSON}" }{/implode} }{else}{ }{/if}' data-can-edit="{if $response->isEditable()}true{else}false{/if}" data-can-delete="{if $response->isDeletable()}true{else}false{/if}" data-user-id="{@$response->userID}">
+               <li class="commentResponse jsCommentResponse" data-object-id="{@$response->responseID}" data-response-id="{@$response->responseID}" data-object-type="com.woltlab.wcf.comment.response" {@$__wcf->getReactionHandler()->getDataAttributes('com.woltlab.wcf.comment.response', $comment->commentID)} data-can-edit="{if $response->isEditable()}true{else}false{/if}" data-can-delete="{if $response->isDeletable()}true{else}false{/if}" data-user-id="{@$response->userID}">
                        <div class="box32">
                                {if $response->userID}
                                        <a href="{link controller='User' object=$response->getUserProfile()}{/link}" title="{$response->getUserProfile()->username}">
@@ -29,6 +29,8 @@
                                                        
                                                        <small class="separatorLeft">{@$response->time|time}</small>
                                                        
+                                                       {include file="reactionSummaryList" isTiny=true reactionData=$likeData[response] objectType="com.woltlab.wcf.comment.response" objectID=$response->responseID}
+                                                       
                                                        {if $response->isDisabled}
                                                                <span class="badge label green jsIconDisabled">{lang}wcf.message.status.disabled{/lang}</span>
                                                        {/if}
@@ -46,6 +48,8 @@
                                                                <li class="jsReportCommentResponse jsOnly" data-object-id="{@$response->responseID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 fa-exclamation-triangle"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                        {/if}
                                                        
+                                                       <li class="jsOnly"><a href="#" class="reactButton jsTooltip" title="{lang}wcf.reactions.react{/lang}">{if $likeData[response][$response->responseID]|isset && $likeData[response][$response->responseID]->reactionTypeID}{@$__wcf->getReactionHandler()->getReactionTypeByID($likeData[response][$response->responseID]->reactionTypeID)->renderIcon()}{else}<img src="{$__wcf->getPath()}/images/reaction/reactionIcon.svg" class="reactionType">{/if} <span class="invisible">{lang}wcf.reactions.react{/lang}</span></a></li>
+                                                       
                                                        {event name='commentOptions'}
                                                </ul>
                                        </nav>
index 1a8bada63164d3ab9f3af7fca3c3397bcd9a2349..8ffedb3c2dc49fca52e652826e4ee3bb9eeb0bdc 100644 (file)
@@ -6,7 +6,7 @@ use wcf\data\comment\response\StructuredCommentResponse;
 use wcf\data\like\object\LikeObject;
 use wcf\system\cache\runtime\UserProfileRuntimeCache;
 use wcf\system\comment\manager\ICommentManager;
-use wcf\system\like\LikeHandler;
+use wcf\system\reaction\ReactionHandler;
 
 /**
  * Provides a structured comment list fetching last responses for every comment.
@@ -166,14 +166,14 @@ class StructuredCommentList extends CommentList {
                if (empty($this->objectIDs)) return [];
                
                $likeData = [];
-               $commentObjectType = LikeHandler::getInstance()->getObjectType('com.woltlab.wcf.comment');
-               LikeHandler::getInstance()->loadLikeObjects($commentObjectType, $this->getObjectIDs());
-               $likeData['comment'] = LikeHandler::getInstance()->getLikeObjects($commentObjectType);
+               $commentObjectType = ReactionHandler::getInstance()->getObjectType('com.woltlab.wcf.comment');
+               ReactionHandler::getInstance()->loadLikeObjects($commentObjectType, $this->getObjectIDs());
+               $likeData['comment'] = ReactionHandler::getInstance()->getLikeObjects($commentObjectType);
                
                if (!empty($this->responseIDs)) {
-                       $responseObjectType = LikeHandler::getInstance()->getObjectType('com.woltlab.wcf.comment.response');
-                       LikeHandler::getInstance()->loadLikeObjects($responseObjectType, $this->responseIDs);
-                       $likeData['response'] = LikeHandler::getInstance()->getLikeObjects($responseObjectType);
+                       $responseObjectType = ReactionHandler::getInstance()->getObjectType('com.woltlab.wcf.comment.response');
+                       ReactionHandler::getInstance()->loadLikeObjects($responseObjectType, $this->responseIDs);
+                       $likeData['response'] = ReactionHandler::getInstance()->getLikeObjects($responseObjectType);
                }
                
                return $likeData;
index edc09b816dd22755a7e0f26942d9107cb84f9a20..c636bdffdf39bdb6de5c94a895b6ece4f976fc1a 100644 (file)
@@ -23,7 +23,9 @@ class ReactionTypeCacheBuilder extends AbstractCacheBuilder {
                        $reactionTypeList->getConditionBuilder()->add('isDisabled = ?', [0]);
                }
                
+               $reactionTypeList->sqlOrderBy = 'showOrder ASC';
                $reactionTypeList->readObjects();
+               
                return $reactionTypeList->getObjects();
        }
 }