#478 pagination improvements

- update page summary only on data change (performance and presentation
improvements)

ng2-components/ng2-alfresco-datatable/src/components/pagination/pagination-provider.ts

@@ -15,6 +15,8 @@
  * limitations under the License.
  */
 
+import { Subject } from 'rxjs/Rx';
+
 export interface PaginationProvider {
 
     /**
@@ -44,4 +46,9 @@ export interface PaginationProvider {
      * or if there was no maxItems parameter the default value is 100.
      */
     maxItems: number;
+
+    /**
+     * An event that is emitted every time data is loaded.
+     */
+    dataLoaded: Subject<any>;
 }

ng2-components/ng2-alfresco-datatable/src/components/pagination/pagination.component.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { PaginationProvider } from './pagination-provider';
 
 @Component({
@@ -24,10 +24,12 @@ import { PaginationProvider } from './pagination-provider';
     templateUrl: './pagination.component.html',
     styleUrls: ['./pagination.component.css']
 })
-export class PaginationComponent {
+export class PaginationComponent implements OnInit {
 
     DEFAULT_PAGE_SIZE: number = 20;
 
+    private _summary: string = '';
+
     @Input()
     supportedPageSizes: number[] = [5, 10, 20, 50, 100];
 
@@ -52,13 +54,7 @@ export class PaginationComponent {
     }
 
     get summary(): string {
-        let from = this.provider.skipCount;
+        return this._summary;
-        if (from === 0) {
-            from = 1;
-        }
-        let to = this.provider.skipCount + this.provider.count;
-        let of = this.provider.totalItems;
-        return `${from}-${to} of ${of}`;
     }
 
     get nextPageAvail(): boolean {
@@ -76,4 +72,20 @@ export class PaginationComponent {
     showPrevPage() {
         this.provider.skipCount -= this.provider.maxItems;
     }
+
+    ngOnInit() {
+        this.provider.dataLoaded.subscribe(() => {
+            this.updateSummary();
+        });
+    }
+
+    private updateSummary() {
+        let from = this.provider.skipCount;
+        if (from === 0) {
+            from = 1;
+        }
+        let to = this.provider.skipCount + this.provider.count;
+        let of = this.provider.totalItems;
+        this._summary = `${from}-${to} of ${of}`;
+    }
 }

ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.ts

@@ -16,6 +16,7 @@
  */
 
 import { DatePipe } from '@angular/common';
+import { Subject } from 'rxjs/Rx';
 import { ObjectUtils } from 'ng2-alfresco-core';
 import {
     PaginationProvider,
@@ -51,10 +52,12 @@ export class ShareDataTableAdapter implements DataTableAdapter, PaginationProvid
     private _maxItems: number = this.DEFAULT_PAGE_SIZE;
 
     thumbnails: boolean = false;
+    dataLoaded: Subject<any>;
 
     constructor(private documentListService: DocumentListService,
                 private basePath: string,
                 schema: DataColumn[]) {
+        this.dataLoaded = new Subject<any>();
         this.rows = [];
         this.columns = schema || [];
         this.resetPagination();
@@ -201,7 +204,10 @@ export class ShareDataTableAdapter implements DataTableAdapter, PaginationProvid
                     maxItems: this._maxItems,
                     skipCount: this._skipCount
                 })
-                .subscribe(val => this.loadPage(<NodePaging>val),
+                .subscribe(val => {
+                    this.loadPage(<NodePaging>val);
+                    this.dataLoaded.next();
+                },
                 error => console.error(error));
         }
     }