Commit 8a1cb95c58080d9367fb2a5905abbcc5f7b284d9

Authored by Victor Costa
Committed by Michel Felipe
1 parent b77b920c

Display comment counts beside paragraphs

src/plugins/comment_paragraph/allow-comment/allow-comment.component.ts
1 import {Component, Input, Inject} from "ng-forward"; 1 import {Component, Input, Inject} from "ng-forward";
2 import {SideCommentsComponent} from "../side-comments/side-comments.component"; 2 import {SideCommentsComponent} from "../side-comments/side-comments.component";
3 import {CommentParagraphEventService} from "../events/comment-paragraph-event.service"; 3 import {CommentParagraphEventService} from "../events/comment-paragraph-event.service";
  4 +import {CommentParagraphService} from "../http/comment-paragraph.service";
4 5
5 @Component({ 6 @Component({
6 selector: "comment-paragraph-plugin-allow-comment", 7 selector: "comment-paragraph-plugin-allow-comment",
7 templateUrl: "plugins/comment_paragraph/allow-comment/allow-comment.html", 8 templateUrl: "plugins/comment_paragraph/allow-comment/allow-comment.html",
8 directives: [SideCommentsComponent] 9 directives: [SideCommentsComponent]
9 }) 10 })
10 -@Inject("$scope", CommentParagraphEventService) 11 +@Inject("$scope", CommentParagraphEventService, CommentParagraphService)
11 export class AllowCommentComponent { 12 export class AllowCommentComponent {
12 13
13 @Input() content: string; 14 @Input() content: string;
14 @Input() paragraphUuid: string; 15 @Input() paragraphUuid: string;
15 @Input() article: noosfero.Article; 16 @Input() article: noosfero.Article;
  17 + commentsCount: number;
16 18
17 - constructor(private $scope: ng.IScope, private commentParagraphEventService: CommentParagraphEventService) { } 19 + constructor(private $scope: ng.IScope,
  20 + private commentParagraphEventService: CommentParagraphEventService,
  21 + private commentParagraphService: CommentParagraphService) { }
18 22
19 ngOnInit() { 23 ngOnInit() {
20 this.commentParagraphEventService.subscribeToggleCommentParagraph((article: noosfero.Article) => { 24 this.commentParagraphEventService.subscribeToggleCommentParagraph((article: noosfero.Article) => {
21 this.article = article; 25 this.article = article;
22 this.$scope.$apply(); 26 this.$scope.$apply();
23 }); 27 });
  28 + this.commentParagraphService.commentParagraphCount(this.article, this.paragraphUuid).then((count: any) => {
  29 + this.commentsCount = count;
  30 + });
24 } 31 }
25 32
26 isActivated() { 33 isActivated() {
src/plugins/comment_paragraph/allow-comment/allow-comment.html
1 <div class="paragraph-content" ng-bind-html="ctrl.content"></div> 1 <div class="paragraph-content" ng-bind-html="ctrl.content"></div>
2 <div ng-if="ctrl.isActivated()" class="actions"> 2 <div ng-if="ctrl.isActivated()" class="actions">
3 - <a href="#" popover-placement="bottom" popover-trigger="outsideClick" uib-popover-template="'plugins/comment_paragraph/allow-comment/popover.html'" ng-click="ctrl.loadComments()"><i class="fa fa-fw fa-comments"></i></a> 3 + <a href="#" popover-placement="bottom" popover-trigger="outsideClick"
  4 + uib-popover-template="'plugins/comment_paragraph/allow-comment/popover.html'"
  5 + ng-click="ctrl.loadComments()">
  6 + <i class="fa fa-fw fa-comments"></i> <span class="count">{{ctrl.commentsCount}}</span>
  7 + </a>
4 </div> 8 </div>
src/plugins/comment_paragraph/allow-comment/allow-comment.scss
@@ -10,5 +10,10 @@ comment-paragraph-plugin-allow-comment { @@ -10,5 +10,10 @@ comment-paragraph-plugin-allow-comment {
10 .popover { 10 .popover {
11 width: 100%; 11 width: 100%;
12 } 12 }
  13 + .count {
  14 + font-size: 14px;
  15 + font-weight: bold;
  16 + color: rgb(99, 170, 204);
  17 + }
13 } 18 }
14 } 19 }
src/plugins/comment_paragraph/hotspot/comment-paragraph-article-button.html
1 -<a href='#' (click)="ctrl.activateCommentParagraph()" ng-show="!ctrl.article.setting.comment_paragraph_plugin_activate">Enable</a>  
2 -<a href='#' (click)="ctrl.deactivateCommentParagraph()" ng-show="ctrl.article.setting.comment_paragraph_plugin_activate">Disable</a> 1 +<a href='#' class="btn btn-default btn-xs" (click)="ctrl.activateCommentParagraph()"
  2 + ng-show="!ctrl.article.setting.comment_paragraph_plugin_activate">Enable</a>
  3 +<a href='#' class="btn btn-default btn-xs" (click)="ctrl.deactivateCommentParagraph()"
  4 + ng-show="ctrl.article.setting.comment_paragraph_plugin_activate">Disable</a>
src/plugins/comment_paragraph/http/comment-paragraph.service.ts
@@ -6,6 +6,8 @@ import {ArticleService} from &quot;../../../lib/ng-noosfero-api/http/article.service&quot; @@ -6,6 +6,8 @@ import {ArticleService} from &quot;../../../lib/ng-noosfero-api/http/article.service&quot;
6 @Inject("Restangular", "$q", "$log", ArticleService) 6 @Inject("Restangular", "$q", "$log", ArticleService)
7 export class CommentParagraphService extends RestangularService<noosfero.Comment> { 7 export class CommentParagraphService extends RestangularService<noosfero.Comment> {
8 8
  9 + private commentParagraphCountsPromise: ng.IPromise<any>;
  10 +
9 constructor(Restangular: restangular.IService, $q: ng.IQService, $log: ng.ILogService, protected articleService: ArticleService) { 11 constructor(Restangular: restangular.IService, $q: ng.IQService, $log: ng.ILogService, protected articleService: ArticleService) {
10 super(Restangular, $q, $log); 12 super(Restangular, $q, $log);
11 } 13 }
@@ -41,4 +43,22 @@ export class CommentParagraphService extends RestangularService&lt;noosfero.Comment @@ -41,4 +43,22 @@ export class CommentParagraphService extends RestangularService&lt;noosfero.Comment
41 let articleElement = this.articleService.getElement(<number>article.id); 43 let articleElement = this.articleService.getElement(<number>article.id);
42 return this.articleService.post("comment_paragraph_plugin/deactivate", articleElement); 44 return this.articleService.post("comment_paragraph_plugin/deactivate", articleElement);
43 } 45 }
  46 +
  47 + commentParagraphCount(article: noosfero.Article, paragraphUuid: string) {
  48 + return this.commentParagraphCounts(article).then((counts: any) => {
  49 + return counts[paragraphUuid];
  50 + });
  51 + }
  52 +
  53 + private commentParagraphCounts(article: noosfero.Article) {
  54 + if (!this.commentParagraphCountsPromise) {
  55 + let articleElement = this.articleService.getElement(<number>article.id);
  56 + this.commentParagraphCountsPromise = articleElement.customGET("comment_paragraph_plugin/comments/count").then((response: restangular.IResponse) => {
  57 + return response.data;
  58 + }).catch(() => {
  59 + this.commentParagraphCountsPromise = null;
  60 + });
  61 + }
  62 + return this.commentParagraphCountsPromise;
  63 + }
44 } 64 }