From e18fb08819633d9f0ba96598f6ced24cf0b21684 Mon Sep 17 00:00:00 2001
From: Victor Costa <vfcosta@gmail.com>
Date: Mon, 1 Aug 2016 18:30:33 -0300
Subject: [PATCH] Use full pagination in side comments

---
 src/app/article/comment/comments.component.ts                               | 20 ++++++++++++++++----
 src/app/article/comment/comments.html                                       |  5 +++++
 src/plugins/comment_paragraph/allow-comment/popover.html                    |  2 +-
 src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts |  2 +-
 src/plugins/comment_paragraph/side-comments/side-comments.component.ts      |  9 +++++----
 src/plugins/comment_paragraph/side-comments/side-comments.scss              |  3 +++
 6 files changed, 31 insertions(+), 10 deletions(-)

diff --git a/src/app/article/comment/comments.component.ts b/src/app/article/comment/comments.component.ts
index 17f680c..accb112 100644
--- a/src/app/article/comment/comments.component.ts
+++ b/src/app/article/comment/comments.component.ts
@@ -16,6 +16,7 @@ export class CommentsComponent {
     @Input() showForm = true;
     @Input() article: noosfero.Article;
     @Input() parent: noosfero.CommentViewModel;
+    @Input() fullPagination = false;
     protected page = 1;
     protected perPage = 5;
     protected total = 0;
@@ -73,14 +74,25 @@ export class CommentsComponent {
 
     loadNextPage() {
         this.loadComments().then((result: noosfero.RestResult<noosfero.Comment[]>) => {
-            this.comments = this.comments.concat(result.data);
+            if (this.fullPagination) {
+                this.comments = result.data;
+            } else {
+                this.comments = this.comments.concat(result.data);
+                this.page++;
+            }
             this.total = result.headers ? result.headers("total") : this.comments.length;
-            this.page++;
         });
     }
 
     displayMore() {
-        let pages = Math.ceil(this.total / this.perPage);
-        return !this.parent && pages >= this.page;
+        return !this.parent && !this.fullPagination && this.getPages() >= this.page;
+    }
+
+    displayFullPagination() {
+        return !this.parent && this.fullPagination && this.getPages() > 0;
+    }
+
+    private getPages() {
+        return Math.ceil(this.total / this.perPage);
     }
 }
diff --git a/src/app/article/comment/comments.html b/src/app/article/comment/comments.html
index efb3d11..3e44463 100644
--- a/src/app/article/comment/comments.html
+++ b/src/app/article/comment/comments.html
@@ -4,5 +4,10 @@
   <div class="comments-list">
     <noosfero-comment (comment-removed)="ctrl.commentRemoved($event.detail)" 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>
+  <uib-pagination ng-if="ctrl.displayFullPagination()" ng-model="ctrl.page" total-items="ctrl.total" class="pagination-sm center-block"
+    boundary-links="true" items-per-page="ctrl.perPage" ng-change="ctrl.loadNextPage()"
+    first-text="«" last-text="»" previous-text="‹" next-text="›">
+  </uib-pagination>
 </div>
diff --git a/src/plugins/comment_paragraph/allow-comment/popover.html b/src/plugins/comment_paragraph/allow-comment/popover.html
index e127df0..fb86ee2 100644
--- a/src/plugins/comment_paragraph/allow-comment/popover.html
+++ b/src/plugins/comment_paragraph/allow-comment/popover.html
@@ -1 +1 @@
-<comment-paragraph-side-comments id="side-comments-{{ctrl.paragraphUuid}}" click-outside="ctrl.hideParagraphComments()" [article]="ctrl.article" [paragraph-uuid]="ctrl.paragraphUuid"></comment-paragraph-side-comments>
+<comment-paragraph-side-comments id="side-comments-{{ctrl.paragraphUuid}}" click-outside="ctrl.hideParagraphComments()" [article]="ctrl.article" [paragraph-uuid]="ctrl.paragraphUuid" [full-pagination]="ctrl.fullPagination"></comment-paragraph-side-comments>
diff --git a/src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts b/src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts
index 34eed73..7e4df66 100644
--- a/src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts
+++ b/src/plugins/comment_paragraph/side-comments/side-comments.component.spec.ts
@@ -10,7 +10,7 @@ describe("Components", () => {
     describe("Side Comments Component", () => {
 
         let serviceMock = jasmine.createSpyObj("CommentParagraphService", ["getByArticle"]);
-        serviceMock.getByArticle = jasmine.createSpy("getByArticle").and.returnValue(Promise.resolve({ data: {} }));
+        serviceMock.getByArticle = jasmine.createSpy("getByArticle").and.returnValue(Promise.resolve({ data: [] }));
 
         let commentServiceMock = {};
         let postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["emit", "subscribe"]);
diff --git a/src/plugins/comment_paragraph/side-comments/side-comments.component.ts b/src/plugins/comment_paragraph/side-comments/side-comments.component.ts
index f8f019f..845d124 100644
--- a/src/plugins/comment_paragraph/side-comments/side-comments.component.ts
+++ b/src/plugins/comment_paragraph/side-comments/side-comments.component.ts
@@ -1,7 +1,7 @@
-import {Component, Inject, Input, Output} from "ng-forward";
-import {CommentsComponent} from "../../../app/article/comment/comments.component";
-import {CommentService} from "../../../lib/ng-noosfero-api/http/comment.service";
-import {CommentParagraphService} from "../http/comment-paragraph.service";
+import { Component, Inject, Input, Output } from "ng-forward";
+import { CommentsComponent } from "../../../app/article/comment/comments.component";
+import { CommentService } from "../../../lib/ng-noosfero-api/http/comment.service";
+import { CommentParagraphService } from "../http/comment-paragraph.service";
 
 @Component({
     selector: "comment-paragraph-side-comments",
@@ -12,6 +12,7 @@ export class SideCommentsComponent extends CommentsComponent {
 
     @Input() article: noosfero.Article;
     @Input() paragraphUuid: string;
+    @Input() fullPagination = true;
 
     constructor(commentService: CommentService,
         $scope: ng.IScope,
diff --git a/src/plugins/comment_paragraph/side-comments/side-comments.scss b/src/plugins/comment_paragraph/side-comments/side-comments.scss
index 1644b50..69956b0 100644
--- a/src/plugins/comment_paragraph/side-comments/side-comments.scss
+++ b/src/plugins/comment_paragraph/side-comments/side-comments.scss
@@ -12,4 +12,7 @@ comment-paragraph-side-comments {
       }
     }
   }
+  .pagination {
+    margin-top: 0;
+  }
 }
--
libgit2 0.21.2