Add basic article reaction implementation (wip)
authorJoshua Rüsweg <josh@bastelstu.be>
Tue, 29 May 2018 12:22:35 +0000 (14:22 +0200)
committerJoshua Rüsweg <josh@bastelstu.be>
Tue, 29 May 2018 12:22:35 +0000 (14:22 +0200)
See #2508

com.woltlab.wcf/templates/article.tpl
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Reaction/CountButtons.js
wcfsetup/install/files/lib/page/ArticlePage.class.php
wcfsetup/install/files/lib/system/user/activity/event/LikeableArticleUserActivityEvent.class.php
wcfsetup/install/lang/de.xml

index 4e0fde5bfdea92410ddec43814dca92dadced738..88d3dc45915926df5c15a63dd9d924bbecd68872 100644 (file)
        
        {event name='beforeArticleContent'}
        
-       <div class="section articleContent"
-                data-object-id="{@$article->articleID}"
-                data-object-type="com.woltlab.wcf.likeableArticle"
-                data-like-liked="{if $articleLikeData[$article->articleID]|isset}{@$articleLikeData[$article->articleID]->liked}{/if}"
-                data-like-likes="{if $articleLikeData[$article->articleID]|isset}{@$articleLikeData[$article->articleID]->likes}{else}0{/if}"
-                data-like-dislikes="{if $articleLikeData[$article->articleID]|isset}{@$articleLikeData[$article->articleID]->dislikes}{else}0{/if}"
-                data-like-users='{ {if $articleLikeData[$article->articleID]|isset}{implode from=$articleLikeData[$article->articleID]->getUsers() item=likeUser}"{@$likeUser->userID}": "{$likeUser->username|encodeJSON}"{/implode}{/if} }'
-                data-user-id="{@$article->userID}"
-       >
+       <div class="section articleContent" {@$__wcf->getReactionHandler()->getDataAttributes('com.woltlab.wcf.likeableArticle', $article->articleID)}>
                <div class="htmlContent">
                        {if $articleContent->teaser}
                                <p class="articleTeaser">{@$articleContent->getFormattedTeaser()}</p>
                
                <div class="row articleLikeSection">
                        <div class="col-xs-12 col-md-6">
-                               <div class="articleLikesSummery"></div>
+                               <div class="articleLikesSummery">
+                                       {include file="reactionSummaryList" reactionData=$articleLikeData objectType="com.woltlab.wcf.likeableArticle" objectID=$article->articleID}
+                               </div>
                        </div>
                        <div class="col-xs-12 col-md-6">
-                               <ul class="articleLikeButtons buttonGroup"></ul>
+                               <ul class="articleLikeButtons buttonGroup">
+                                       <li class="jsOnly"><span class="button reactButton{if $articleLikeData[$article->articleID]|isset && $articleLikeData[$article->articleID]->reactionTypeID} active{/if}" title="{lang}wcf.reactions.react{/lang}">{if $articleLikeData[$article->articleID]|isset && $articleLikeData[$article->articleID]->reactionTypeID}{@$__wcf->getReactionHandler()->getReactionTypeByID($articleLikeData[$article->articleID]->reactionTypeID)->renderIcon()}{else}<img src="{$__wcf->getPath()}/images/reaction/reactionIcon.svg" style="width:24px;height:24px;" alt="">{/if}</span></li>
+                               </ul>
                        </div>
                </div>
        </div>
 
 {if MODULE_LIKE && ARTICLE_ENABLE_LIKE}
        <script data-relocate="true">
-               require(['WoltLabSuite/Core/Ui/Like/Handler'], function(UiLikeHandler) {
+               require(['WoltLabSuite/Core/Ui/Reaction/Handler'], function(UiLikeHandler) {
                        new UiLikeHandler('com.woltlab.wcf.likeableArticle', {
-                               // settings
-                               isSingleItem: true,
-                               
                                // permissions
-                               canDislike: {if LIKE_ENABLE_DISLIKE}true{else}false{/if},
-                               canLike: {if $__wcf->getUser()->userID}true{else}false{/if},
-                               canLikeOwnContent: {if LIKE_ALLOW_FOR_OWN_CONTENT}true{else}false{/if},
-                               canViewSummary: {if LIKE_SHOW_SUMMARY}true{else}false{/if},
+                               canReact: {if $__wcf->getUser()->userID}true{else}false{/if},
+                               canReactToOwnContent: {if LIKE_ALLOW_FOR_OWN_CONTENT}true{else}false{/if},
+                               canViewReactions: {if LIKE_SHOW_SUMMARY}true{else}false{/if},
                                
                                // selectors
-                               badgeContainerSelector: '.articleLikesBadge',
-                               buttonAppendToSelector: '.articleLikeButtons',
                                containerSelector: '.articleContent',
                                summarySelector: '.articleLikesSummery'
                        });
index 30398ee9e30a6e659518afeca579078d11ea2aa4..4bb40fb170150487fc4ea49b9f95d18800268301 100644 (file)
@@ -135,7 +135,7 @@ define(
                                        else if (REACTION_TYPES[key] !== undefined) {
                                                // create element 
                                                var createdElement = elCreate('li');
-                                               createdElement.className = 'button small reactCountButton';
+                                               createdElement.className = 'reactCountButton';
                                                createdElement.innerHTML = REACTION_TYPES[key].renderedIcon +' '; 
                                                elData(createdElement, 'reaction-type-id', key);
                                                
index 3bbfe0da3e9fd4fd20079809a55cd80a86803b78..1fd92a633df426dc591a2ee398892e99b70e2385 100644 (file)
@@ -7,7 +7,7 @@ use wcf\data\comment\StructuredCommentList;
 use wcf\data\like\object\LikeObject;
 use wcf\system\comment\manager\ICommentManager;
 use wcf\system\comment\CommentHandler;
-use wcf\system\like\LikeHandler;
+use wcf\system\reaction\ReactionHandler;
 use wcf\system\request\LinkHandler;
 use wcf\system\MetaTagHandler;
 use wcf\system\WCF;
@@ -99,9 +99,9 @@ class ArticlePage extends AbstractArticlePage {
                
                // fetch likes
                if (MODULE_LIKE) {
-                       $objectType = LikeHandler::getInstance()->getObjectType('com.woltlab.wcf.likeableArticle');
-                       LikeHandler::getInstance()->loadLikeObjects($objectType, [$this->article->articleID]);
-                       $this->articleLikeData = LikeHandler::getInstance()->getLikeObjects($objectType);
+                       $objectType = ReactionHandler::getInstance()->getObjectType('com.woltlab.wcf.likeableArticle');
+                       ReactionHandler::getInstance()->loadLikeObjects($objectType, [$this->article->articleID]);
+                       $this->articleLikeData = ReactionHandler::getInstance()->getLikeObjects($objectType);
                }
                
                // add meta/og tags
index 8f5faa56fce540fff9f5e17a6e6530f367248ccb..2efd393b8ebbbd01a97a2ebfa8f8679cb43072fe 100644 (file)
@@ -42,7 +42,10 @@ class LikeableArticleUserActivityEvent extends SingletonFactory implements IUser
                                $event->setIsAccessible();
                                
                                // short output
-                               $text = WCF::getLanguage()->getDynamicVariable('wcf.article.recentActivity.likedArticle', ['article' => $article]);
+                               $text = WCF::getLanguage()->getDynamicVariable('wcf.article.recentActivity.likedArticle', [
+                                       'article' => $article, 
+                                       'reactionType' => $event->reactionType
+                               ]);
                                $event->setTitle($text);
                                
                                // output
index 73d88b21100abc55808c616a516db916630e6944..6776e090aaf670bb0f020a1b6c10b5d913b40b20 100644 (file)
@@ -2329,7 +2329,7 @@ Benutzerkontos nun in vollem Umfang nutzen.]]></item>
                <item name="wcf.article.aboutAuthor"><![CDATA[Über den Autor]]></item>
                <item name="wcf.article.articleComments"><![CDATA[{#$article->comments} Kommentar{if $article->comments != 1}e{/if}]]></item>
                <item name="wcf.article.articleViews"><![CDATA[{#$article->views} Mal gelesen]]></item>
-               <item name="wcf.article.recentActivity.likedArticle"><![CDATA[Mag den Artikel <a href="{$article->getLink()}">{$article->getTitle()}</a>.]]></item>
+               <item name="wcf.article.recentActivity.likedArticle"><![CDATA[Hat mit „{$reactionType->getTitle()}“ auf den Artikel <a href="{$article->getLink()}">{$article->getTitle()}</a> reagiert.]]></item>
                <item name="wcf.article.recentActivity.articleComment"><![CDATA[Hat einen Kommentar zum Artikel <a href="{$article->getLink()}#comment{$commentID}">{$article->getTitle()}</a> geschrieben.]]></item>
                <item name="wcf.article.recentActivity.articleCommentResponse"><![CDATA[Hat auf einen Kommentar von <a href="{link controller='User' object=$commentAuthor}{/link}">{$commentAuthor->username}</a> zum Artikel <a href="{$article->getLink()}#comment{@$commentID}/response{@$responseID}">{$article->getTitle()}</a> geantwortet.]]></item>
                <item name="wcf.article.search.categories"><![CDATA[Folgende Kategorien durchsuchen]]></item>
@@ -3413,6 +3413,13 @@ E-Mail-Adresse: {@$emailAddress} {* this line ends with a space *}
                <item name="wcf.poll.endTimeInfo"><![CDATA[Umfrage endet am {@$poll->endTime|plainTime}]]></item>
        </category>
        
+       <category name="wcf.reactions">
+               <item name="wcf.reactions.summary.title"><![CDATA[Reaktionen]]></item>
+               <item name="wcf.reactions.summary.noReactions"><![CDATA[Es gibt bisher keine Reaktionen dieses Types auf das Objekt.]]></item>
+               <item name="wcf.reactions.summary.listReactions"><![CDATA[Reaktionen auflisten]]></item>
+               <item name="wcf.reactions.react"><![CDATA[Reagieren]]></item>
+       </category>
+       
        <category name="wcf.recaptcha">
                <item name="wcf.recaptcha.title"><![CDATA[Sicherheitsabfrage („reCAPTCHA“)]]></item>
                <item name="wcf.recaptcha.description"><![CDATA[Bitte {if LANGUAGE_USE_INFORMAL_VARIANT}gib{else}geben Sie{/if} die untenstehenden Zeichen in das leere Feld ein. Groß- und Kleinschreibung müssen nicht beachtet werden. {if LANGUAGE_USE_INFORMAL_VARIANT}Solltest du{else}Sollten Sie{/if} das Bild trotz Neuladen nicht identifizieren können, {if LANGUAGE_USE_INFORMAL_VARIANT}wende dich{else}wenden Sie sich{/if} an den Administrator.]]></item>
@@ -3885,7 +3892,7 @@ Die E-Mail-Adresse des neuen Benutzers lautet: {@$user->email}
                <item name="wcf.user.recentActivity.com.woltlab.wcf.user.recentActivityEvent.follow"><![CDATA[Folgen]]></item>
                <item name="wcf.user.recentActivity.com.woltlab.wcf.user.profileComment.recentActivityEvent"><![CDATA[Pinnwand-Kommentar]]></item>
                <item name="wcf.user.recentActivity.com.woltlab.wcf.user.profileComment.response.recentActivityEvent"><![CDATA[Pinnwand-Antwort]]></item>
-               <item name="wcf.user.recentActivity.com.woltlab.wcf.likeableArticle.recentActivityEvent"><![CDATA[Like (Artikel)]]></item>
+               <item name="wcf.user.recentActivity.com.woltlab.wcf.likeableArticle.recentActivityEvent"><![CDATA[Reaktion (Artikel)]]></item>
                <item name="wcf.user.recentActivity.com.woltlab.wcf.articleComment.recentActivityEvent"><![CDATA[Kommentar (Artikel)]]></item>
                <item name="wcf.user.recentActivity.com.woltlab.wcf.articleComment.response.recentActivityEvent"><![CDATA[Antwort (Artikel)]]></item>
                <item name="wcf.user.recentActivity.com.woltlab.wcf.userTrophy.recentActivityEvent.trophyReceived"><![CDATA[Trophäe]]></item>