Michel Felipe · Ábner Oliveira · Ábner Oliveira · Michel Felipe · Michel Felipe · Michel Felipe
Showing 14 changed files Show diff stats
src/app/article/comment/comments.component.spec.ts
src/app/article/comment/comments.component.ts
src/app/article/comment/comments.html
src/app/article/comment/post-comment/post-comment.component.spec.ts
src/app/article/comment/post-comment/post-comment.component.ts
src/lib/ng-noosfero-api/decorators/mixins.ts
src/lib/ng-noosfero-api/http/comment.service.ts
src/lib/ng-noosfero-api/mixins/event-service.mixin.ts
src/plugins/comment_paragraph/allow-comment/allow-comment.component.spec.ts
src/plugins/comment_paragraph/allow-comment/allow-comment.component.ts
src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts
src/plugins/comment_paragraph/side-comments/side-comments.component.ts
src/plugins/comment_paragraph/side-comments/side-comments.html
src/spec/mocks.ts
@@ -11,7 +11,7 @@ describe(&quot;Components&quot;, () =&gt; {
         beforeEach(angular.mock.module("templates"));
-        let commentService = jasmine.createSpyObj("commentService", ["getByArticle"]);
+        let commentService = helpers.mocks.commentService;
         let comments = [{ id: 2 }, { id: 3 }];
         commentService.getByArticle = jasmine.createSpy("getByArticle")
@@ -19,7 +19,7 @@ describe(&quot;Components&quot;, () =&gt; {
         let properties = { article: { id: 1 }, parent: <any>null };
         function createComponent() {
-            // postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["subscribe"]);
+
             let providers = [
                 helpers.createProviderToValue('CommentService', commentService),
                 helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
@@ -52,7 +52,9 @@ describe(&quot;Components&quot;, () =&gt; {
         it("update comments list when receive an reply", done => {
             properties.parent = { id: 3 };
             createComponent().then(fixture => {
-                (<CommentsComponent>fixture.debugElement.componentViewChildren[0].componentInstance).commentAdded(<noosfero.Comment>{ id: 1, reply_of: { id: 3 } });
+                let component = (<CommentsComponent>fixture.debugElement.componentViewChildren[0].componentInstance);
+                component.commentAdded(<noosfero.Comment>{ id: 1, reply_of: { id: 3 } });
+
                 fixture.detectChanges();
                 expect(fixture.debugElement.queryAll("noosfero-comment").length).toEqual(3);
                 done();
@@ -6,10 +6,9 @@ import { CommentComponent } from &quot;./comment.component&quot;;
 @Component({
     selector: 'noosfero-comments',
     templateUrl: 'app/article/comment/comments.html',
-    directives: [PostCommentComponent, CommentComponent],
-    outputs: ['commentAdded']
+    directives: [PostCommentComponent, CommentComponent]
 })
-@Inject(CommentService, "$element")
+@Inject(CommentService, "$scope")
 export class CommentsComponent {
     comments: noosfero.CommentViewModel[] = [];
@@ -22,7 +21,7 @@ export class CommentsComponent {
     newComment = <noosfero.Comment>{};
-    constructor(protected commentService: CommentService, private $scope: ng.IScope) { }
+    constructor(public commentService: CommentService, private $scope: ng.IScope) { }
     ngOnInit() {
         if (this.parent) {
@@ -30,20 +29,27 @@ export class CommentsComponent {
         } else {
             this.loadNextPage();
         }
+
+        this.commentService.addEvent<noosfero.Comment>({
+            event: 'onSave',
+            component: 'CommentsComponent',
+            callback: (comment: noosfero.Comment) => {
+
+                if (this.commentService.called !== <string>comment.id.toString()) {
+
+                    this.commentAdded(comment);
+                    this.commentService.called = comment.id.toString();
+                }
+            }
+        });
+
     }
-    commentAdded(comment: noosfero.Comment): void {
+    commentAdded(comment: noosfero.CommentViewModel): void {
+        comment.__show_reply = false;
         this.comments.push(comment);
         this.resetShowReply();
-    }
-
-    private resetShowReply() {
-        this.comments.forEach((comment: noosfero.CommentViewModel) => {
-            comment.__show_reply = false;
-        });
-        if (this.parent) {
-            this.parent.__show_reply = false;
-        }
+        this.$scope.$apply();
     }
     loadComments() {
@@ -62,4 +68,13 @@ export class CommentsComponent {
         let pages = Math.ceil(this.total / this.perPage);
         return !this.parent && pages >= this.page;
     }
+
+    private resetShowReply() {
+        this.comments.forEach((comment: noosfero.CommentViewModel) => {
+            comment.__show_reply = false;
+        });
+        if (this.parent) {
+            this.parent.__show_reply = false;
+        }
+    }
 }
 <div class="comments">
-  <noosfero-post-comment (comment-saved)="ctrl.commentAdded($event.detail)" ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment"></noosfero-post-comment>
-  
+  <noosfero-post-comment ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment"></noosfero-post-comment>
+
   <div class="comments-list">
     <noosfero-comment ng-repeat="comment in ctrl.comments | orderBy: 'created_at':true" [comment]="comment" [article]="ctrl.article"></noosfero-comment>
   </div>
@@ -11,7 +11,8 @@ describe(&quot;Components&quot;, () =&gt; {
         beforeEach(angular.mock.module("templates"));
-        let commentService = jasmine.createSpyObj("commentService", ["createInArticle"]);
+        let commentService = helpers.mocks.commentService;
+        commentService.emitEvent = jasmine.createSpy("emitEvent");
         let user = {};
         let providers = [
             new Provider('CommentService', { useValue: commentService }),
@@ -43,10 +44,9 @@ describe(&quot;Components&quot;, () =&gt; {
         it("emit an event when create comment", done => {
             helpers.createComponentFromClass(ContainerComponent).then(fixture => {
                 let component: PostCommentComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
-                component.commentSaved.next = jasmine.createSpy("next");
                 commentService.createInArticle = jasmine.createSpy("createInArticle").and.returnValue(helpers.mocks.promiseResultTemplate({ data: {} }));
                 component.save();
-                expect(component.commentSaved.next).toHaveBeenCalled();
+                expect(component.commentService.emitEvent).toHaveBeenCalled();
                 done();
             });
         });
+import {ngClass} from 'ng-forward/cjs/testing/test-component-builder';
 import { Inject, Input, Output, EventEmitter, Component } from 'ng-forward';
 import { CommentService } from "../../../../lib/ng-noosfero-api/http/comment.service";
 import { NotificationService } from "../../../shared/services/notification.service";
@@ -17,11 +18,12 @@ export class PostCommentComponent {
     @Input() article: noosfero.Article;
     @Input() parent: noosfero.Comment;
-    @Output() commentSaved: EventEmitter<Comment> = new EventEmitter<Comment>();
     @Input() comment = <noosfero.Comment>{};
+    @Input() identifier: any;
     private currentUser: noosfero.User;
-    constructor(private commentService: CommentService,
+    constructor(
+        public commentService: CommentService,
         private notificationService: NotificationService,
         private session: SessionService) {
         this.currentUser = this.session.currentUser();
@@ -32,7 +34,22 @@ export class PostCommentComponent {
             this.comment.reply_of_id = this.parent.id;
         }
         this.commentService.createInArticle(this.article, this.comment).then((result: noosfero.RestResult<noosfero.Comment>) => {
-            this.commentSaved.next(result.data);
+
+            if (this.identifier) {
+                this.commentService.emitEvent({
+                    id: this.identifier,
+                    event: 'onSave',
+                    param: result.data
+                });
+            } else {
+                this.commentService.emitEvent({
+                    id: result.data.id,
+                    component: 'CommentsComponent',
+                    event: 'onSave',
+                    param: result.data
+                });
+            }
+
             this.comment.body = "";
             this.notificationService.success({ title: "comment.post.success.title", message: "comment.post.success.message" });
         });
@@ -0,0 +1,9 @@
+export function Mixins(...mixins: Function[]) {
+    return function(target: Function) {
+        mixins.forEach(mixin => {
+            Object.getOwnPropertyNames(mixin.prototype).forEach(name => {
+                target.prototype[name] = mixin.prototype[name];
+            });
+        });
+    };
+}
-import { Injectable, Inject } from "ng-forward";
+import { Injectable, Inject, EventEmitter } from "ng-forward";
 import {RestangularService} from "./restangular_service";
 import {ArticleService} from "./article.service";
+import {Mixins, EventService, IEvent} from '../mixins/event-service.mixin';
+
 @Injectable()
+@Mixins(EventService)
 @Inject("Restangular", "$q", "$log", ArticleService)
-export class CommentService extends RestangularService<noosfero.Comment> {
+export class CommentService extends RestangularService<noosfero.Comment> implements EventService {
+
+    events: IEvent[] = [];
+
+    called: string;
     constructor(Restangular: restangular.IService, $q: ng.IQService, $log: ng.ILogService, protected articleService: ArticleService) {
         super(Restangular, $q, $log);
@@ -31,4 +38,9 @@ export class CommentService extends RestangularService&lt;noosfero.Comment&gt; {
         let articleElement = this.articleService.getElement(<number>article.id);
         return this.create(comment, articleElement, null, { 'Content-Type': 'application/json' }, false);
     }
+
+    // Mixin "EventService" declarations
+    addEvent: <T>(data: { event: string, callback: Function, id?: any, component?: string, scope?: any }) => void;
+    getEvents: (data: { event: string, id?: any, component?: string }) => void;
+    emitEvent: <T>(data: { event: string, param: T, id?: any, component?: string }) => void;
 }
@@ -0,0 +1,104 @@
+import { EventEmitter } from "ng-forward";
+export {Mixins} from "../decorators/mixins";
+
+export interface IEvent {
+    id: any;
+    component: string;
+    emitters: {
+        onSave?: EventEmitter<noosfero.Comment>
+    };
+}
+
+/**
+ * @ngdoc object
+ * @name mixins.EventService
+ * @see Typescript official documentation https://www.typescriptlang.org/docs/mixins.html
+ * @description
+ *
+ * A mixin class to be implemented by another class (e.g. Angular Services)
+ * to emit's and subscribe events
+ *
+ * <pre>
+ * @Mixins(EventService)
+ * export class MyService implements EventService {
+ *
+ * }
+ * </pre>
+ */
+export class EventService {
+
+    events: IEvent[] = [];
+
+    called: string;
+
+    addEvent<T>(data: { event: string, callback: Function, id?: any, component?: string, scope?: any }) {
+
+        let hasEvent = false;
+
+        if (this.events.length > 0) {
+
+            this.events.forEach((eventData: IEvent, index: number) => {
+                if (data.id === eventData.id) {
+
+                    if (!(<any>this.events)[index].emitters[data.event]) {
+                        (<any>this.events)[index].emitters[data.event] = new EventEmitter();
+                    } else {
+                        (<EventEmitter<T>>(<any>this.events)[index].emitters[data.event]).subscribe(data.callback.bind(data.scope || this));
+                    }
+
+                    return (hasEvent = true);
+                }
+            });
+        }
+
+        if (!hasEvent) {
+
+            let newEvent: IEvent = {
+                id: data.id,
+                component: data.component,
+                emitters: <any>{}
+            };
+
+            (<any>newEvent.emitters)[data.event] = <EventEmitter<T>>new EventEmitter();
+            (<any>newEvent.emitters)[data.event].subscribe(data.callback);
+
+            this.events.push(newEvent);
+        }
+    }
+
+    getEvents(data: { event: string, id?: any, component?: string }): any {
+        let result: any = {};
+
+        for (let i = 0; i < this.events.length; i++) {
+            if (data.id === (<Array<IEvent>>this.events)[i].id && !data.component) {
+
+                result = (<any>this.events)[i].emitters[data.event];
+                break;
+            } else if (data.component === (<any>this.events)[i].component) {
+                result[data.component] = (<any>this.events)[i].emitters[data.event];
+
+                break;
+            } else {
+                result[(<any>this.events)[i].component] = (<any>this.events)[i].emitters[data.event];
+            }
+        }
+
+        return result;
+    }
+
+    emitEvent<T>(data: { event: string, param: T, id?: any, component?: string }) {
+
+        let eventOrEmitters = this.getEvents(data);
+
+        if (eventOrEmitters instanceof EventEmitter) {
+
+            eventOrEmitters.next(data.param);
+        } else {
+
+            Object.keys(eventOrEmitters).forEach((emitter: string) => {
+                (<EventEmitter<T>>eventOrEmitters[emitter]).next(data.param);
+            });
+
+        }
+    }
+}
@@ -24,7 +24,8 @@ describe(&quot;Components&quot;, () =&gt; {
         let providers = [
             new Provider('CommentParagraphService', { useValue: serviceMock }),
-            new Provider('CommentParagraphEventService', { useValue: eventServiceMock })
+            new Provider('CommentParagraphEventService', { useValue: eventServiceMock }),
+            new Provider('CommentService', { useValue: helpers.mocks.commentService })
         ];
         let helper: ComponentTestHelper<AllowCommentComponent>;
-import {Component, Input, Inject} from "ng-forward";
+import {Component, Input, Inject, bundleStore} from "ng-forward";
 import {SideCommentsComponent} from "../side-comments/side-comments.component";
 import {CommentParagraphEventService} from "../events/comment-paragraph-event.service";
 import {CommentParagraphService} from "../http/comment-paragraph.service";
+import {CommentService} from "../../../lib/ng-noosfero-api/http/comment.service";
+import {PostCommentComponent} from '../../../app/article/comment/post-comment/post-comment.component';
 @Component({
     selector: "comment-paragraph-plugin-allow-comment",
     templateUrl: "plugins/comment_paragraph/allow-comment/allow-comment.html",
     directives: [SideCommentsComponent]
 })
-@Inject("$scope", CommentParagraphEventService, CommentParagraphService)
+@Inject("$scope", CommentParagraphEventService, CommentParagraphService, CommentService)
 export class AllowCommentComponent {
     @Input() content: string;
     @Input() paragraphUuid: string;
     @Input() article: noosfero.Article;
-    commentsCount: number;
+    commentsCount: number = 0;
     display = false;
-    constructor(private $scope: ng.IScope,
+    constructor(
+        private $scope: ng.IScope,
         private commentParagraphEventService: CommentParagraphEventService,
-        private commentParagraphService: CommentParagraphService) { }
+        private commentParagraphService: CommentParagraphService,
+        private commentService: CommentService
+    ) { }
     ngOnInit() {
         this.commentParagraphEventService.subscribeToggleCommentParagraph((article: noosfero.Article) => {
@@ -29,6 +34,20 @@ export class AllowCommentComponent {
         this.commentParagraphService.commentParagraphCount(this.article, this.paragraphUuid).then((count: number) => {
             this.commentsCount = count;
         });
+
+        this.commentService.addEvent<noosfero.Comment>({
+            id: this.paragraphUuid,
+            event: 'onSave',
+            component: 'SideCommentsComponent',
+            scope: this,
+            callback: () => {
+                if (!this.commentsCount) {
+                    this.commentsCount = 0;
+                }
+                this.commentsCount++;
+                this.$scope.$apply();
+            }
+        });
     }
     isActivated() {
@@ -12,14 +12,9 @@ describe(&quot;Components&quot;, () =&gt; {
         let serviceMock = jasmine.createSpyObj("CommentParagraphService", ["getByArticle"]);
         serviceMock.getByArticle = jasmine.createSpy("getByArticle").and.returnValue(Promise.resolve({ data: {} }));
-        let commentServiceMock = {};
-        let postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["emit", "subscribe"]);
-        postCommentEventService.subscribe = jasmine.createSpy("subscribe");
-
         let providers = [
             new Provider('CommentParagraphService', { useValue: serviceMock }),
-            new Provider('CommentService', { useValue: commentServiceMock }),
-            new Provider('PostCommentEventService', { useValue: postCommentEventService })
+            new Provider('CommentService', { useValue: helpers.mocks.commentService }),
         ];
         let helper: ComponentTestHelper<SideCommentsComponent>;
@@ -5,7 +5,7 @@ import {CommentParagraphService} from &quot;../http/comment-paragraph.service&quot;;
 @Component({
     selector: "comment-paragraph-side-comments",
-    templateUrl: 'app/article/comment/comments.html',
+    templateUrl: 'plugins/comment_paragraph/side-comments/side-comments.html',
 })
 @Inject(CommentService, "$scope", CommentParagraphService)
 export class SideCommentsComponent extends CommentsComponent {
@@ -0,0 +1,8 @@
+<div class="comments">
+  <noosfero-post-comment ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment" [identifier]="ctrl.paragraphUuid"></noosfero-post-comment>
+
+  <div class="comments-list">
+    <noosfero-comment ng-repeat="comment in ctrl.comments | orderBy: 'created_at':true" [comment]="comment" [article]="ctrl.article"></noosfero-comment>
+  </div>
+  <button type="button" ng-if="ctrl.displayMore()" class="more-comments btn btn-default btn-block" ng-click="ctrl.loadNextPage()">{{"comment.pagination.more" | translate}}</button>
+</div>
@@ -122,9 +122,13 @@ export var mocks: any = {
         instant: () => { }
     },
     commentService: {
+        events: <any[]>[],
+        called: <string>'',
         getByArticle: (article: noosfero.Article) => {
             return Promise.resolve({ data: {} });
-        }
+        },
+        addEvent: () => { },
+        emitEvent: () => { }
     },
     sessionWithCurrentUser: (user: any) => {
         return {
1	<div class="comments">	1	<div class="comments">
2	- <noosfero-post-comment (comment-saved)="ctrl.commentAdded($event.detail)" ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment"></noosfero-post-comment>
3	-	2	+ <noosfero-post-comment ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment"></noosfero-post-comment>
		3	+
4	<div class="comments-list">	4	<div class="comments-list">
5	<noosfero-comment ng-repeat="comment in ctrl.comments \| orderBy: 'created_at':true" [comment]="comment" [article]="ctrl.article"></noosfero-comment>	5	<noosfero-comment ng-repeat="comment in ctrl.comments \| orderBy: 'created_at':true" [comment]="comment" [article]="ctrl.article"></noosfero-comment>
6	</div>	6	</div>
@@ -0,0 +1,9 @@		@@ -0,0 +1,9 @@
	1	+export function Mixins(...mixins: Function[]) {
	2	+ return function(target: Function) {
	3	+ mixins.forEach(mixin => {
	4	+ Object.getOwnPropertyNames(mixin.prototype).forEach(name => {
	5	+ target.prototype[name] = mixin.prototype[name];
	6	+ });
	7	+ });
	8	+ };
	9	+}
@@ -0,0 +1,104 @@		@@ -0,0 +1,104 @@
	1	+import { EventEmitter } from "ng-forward";
	2	+export {Mixins} from "../decorators/mixins";
	3	+
	4	+export interface IEvent {
	5	+ id: any;
	6	+ component: string;
	7	+ emitters: {
	8	+ onSave?: EventEmitter<noosfero.Comment>
	9	+ };
	10	+}
	11	+
	12	+/**
	13	+ * @ngdoc object
	14	+ * @name mixins.EventService
	15	+ * @see Typescript official documentation https://www.typescriptlang.org/docs/mixins.html
	16	+ * @description
	17	+ *
	18	+ * A mixin class to be implemented by another class (e.g. Angular Services)
	19	+ * to emit's and subscribe events
	20	+ *
	21	+ * <pre>
	22	+ * @Mixins(EventService)
	23	+ * export class MyService implements EventService {
	24	+ *
	25	+ * }
	26	+ * </pre>
	27	+ */
	28	+export class EventService {
	29	+
	30	+ events: IEvent[] = [];
	31	+
	32	+ called: string;
	33	+
	34	+ addEvent<T>(data: { event: string, callback: Function, id?: any, component?: string, scope?: any }) {
	35	+
	36	+ let hasEvent = false;
	37	+
	38	+ if (this.events.length > 0) {
	39	+
	40	+ this.events.forEach((eventData: IEvent, index: number) => {
	41	+ if (data.id === eventData.id) {
	42	+
	43	+ if (!(<any>this.events)[index].emitters[data.event]) {
	44	+ (<any>this.events)[index].emitters[data.event] = new EventEmitter();
	45	+ } else {
	46	+ (<EventEmitter<T>>(<any>this.events)[index].emitters[data.event]).subscribe(data.callback.bind(data.scope \|\| this));
	47	+ }
	48	+
	49	+ return (hasEvent = true);
	50	+ }
	51	+ });
	52	+ }
	53	+
	54	+ if (!hasEvent) {
	55	+
	56	+ let newEvent: IEvent = {
	57	+ id: data.id,
	58	+ component: data.component,
	59	+ emitters: <any>{}
	60	+ };
	61	+
	62	+ (<any>newEvent.emitters)[data.event] = <EventEmitter<T>>new EventEmitter();
	63	+ (<any>newEvent.emitters)[data.event].subscribe(data.callback);
	64	+
	65	+ this.events.push(newEvent);
	66	+ }
	67	+ }
	68	+
	69	+ getEvents(data: { event: string, id?: any, component?: string }): any {
	70	+ let result: any = {};
	71	+
	72	+ for (let i = 0; i < this.events.length; i++) {
	73	+ if (data.id === (<Array<IEvent>>this.events)[i].id && !data.component) {
	74	+
	75	+ result = (<any>this.events)[i].emitters[data.event];
	76	+ break;
	77	+ } else if (data.component === (<any>this.events)[i].component) {
	78	+ result[data.component] = (<any>this.events)[i].emitters[data.event];
	79	+
	80	+ break;
	81	+ } else {
	82	+ result[(<any>this.events)[i].component] = (<any>this.events)[i].emitters[data.event];
	83	+ }
	84	+ }
	85	+
	86	+ return result;
	87	+ }
	88	+
	89	+ emitEvent<T>(data: { event: string, param: T, id?: any, component?: string }) {
	90	+
	91	+ let eventOrEmitters = this.getEvents(data);
	92	+
	93	+ if (eventOrEmitters instanceof EventEmitter) {
	94	+
	95	+ eventOrEmitters.next(data.param);
	96	+ } else {
	97	+
	98	+ Object.keys(eventOrEmitters).forEach((emitter: string) => {
	99	+ (<EventEmitter<T>>eventOrEmitters[emitter]).next(data.param);
	100	+ });
	101	+
	102	+ }
	103	+ }
	104	+}
	@@ -24,7 +24,8 @@ describe("Components", () => {		@@ -24,7 +24,8 @@ describe("Components", () => {
24		24
25	let providers = [	25	let providers = [
26	new Provider('CommentParagraphService', { useValue: serviceMock }),	26	new Provider('CommentParagraphService', { useValue: serviceMock }),
27	- new Provider('CommentParagraphEventService', { useValue: eventServiceMock })	27	+ new Provider('CommentParagraphEventService', { useValue: eventServiceMock }),
		28	+ new Provider('CommentService', { useValue: helpers.mocks.commentService })
28	];	29	];
29	let helper: ComponentTestHelper<AllowCommentComponent>;	30	let helper: ComponentTestHelper<AllowCommentComponent>;
30		31
	@@ -5,7 +5,7 @@ import {CommentParagraphService} from "../http/comment-paragraph.service";		@@ -5,7 +5,7 @@ import {CommentParagraphService} from "../http/comment-paragraph.service";
5		5
6	@Component({	6	@Component({
7	selector: "comment-paragraph-side-comments",	7	selector: "comment-paragraph-side-comments",
8	- templateUrl: 'app/article/comment/comments.html',	8	+ templateUrl: 'plugins/comment_paragraph/side-comments/side-comments.html',
9	})	9	})
10	@Inject(CommentService, "$scope", CommentParagraphService)	10	@Inject(CommentService, "$scope", CommentParagraphService)
11	export class SideCommentsComponent extends CommentsComponent {	11	export class SideCommentsComponent extends CommentsComponent {
@@ -0,0 +1,8 @@		@@ -0,0 +1,8 @@
	1	+<div class="comments">
	2	+ <noosfero-post-comment ng-if="ctrl.showForm" [article]="ctrl.article" [parent]="ctrl.parent" [comment]="ctrl.newComment" [identifier]="ctrl.paragraphUuid"></noosfero-post-comment>
	3	+
	4	+ <div class="comments-list">
	5	+ <noosfero-comment ng-repeat="comment in ctrl.comments \| orderBy: 'created_at':true" [comment]="comment" [article]="ctrl.article"></noosfero-comment>
	6	+ </div>
	7	+ <button type="button" ng-if="ctrl.displayMore()" class="more-comments btn btn-default btn-block" ng-click="ctrl.loadNextPage()">{{"comment.pagination.more" \| translate}}</button>
	8	+</div>