Move 'pagination' from 'core' to 'datatable'

ng2-components/ng2-alfresco-datatable/index.ts

@@ -15,18 +15,5 @@
  * limitations under the License.
  */
 
-import { DataTableComponent } from './src/components/datatable.component';
-import { NoContentTemplateComponent } from './src/components/no-content-template.component';
-
-// components
-export * from './src/components/datatable.component';
-export * from './src/components/no-content-template.component';
-
-// data
-export * from './src/data/datatable-adapter';
-export * from './src/data/object-datatable-adapter';
-
-export const ALFRESCO_DATATABLE_DIRECTIVES: [any] = [
-    DataTableComponent,
-    NoContentTemplateComponent
-];
+export * from './src/data/index';
+export * from './src/components/index';

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

@@ -26,12 +26,10 @@ import { DataTableComponent } from './datatable.component';
 import {
     DataRow,
     DataColumn,
-    DataSorting
-} from './../data/datatable-adapter';
-import {
+    DataSorting,
     ObjectDataTableAdapter,
     ObjectDataColumn
-} from './../data/object-datatable-adapter';
+} from './../../data/index';
 
 describe('DataTable', () => {
 

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

@@ -36,9 +36,9 @@ import {
     DataRow,
     DataColumn,
     DataSorting,
-    DataRowEvent
-} from './../data/datatable-adapter';
-import { ObjectDataTableAdapter } from '../data/object-datatable-adapter';
+    DataRowEvent,
+    ObjectDataTableAdapter
+} from '../../data/index';
 
 declare var componentHandler;
 declare let __moduleName: string;

ng2-components/ng2-alfresco-datatable/src/components/datatable/index.ts

@@ -0,0 +1,27 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { DataTableComponent } from './datatable.component';
+import { NoContentTemplateComponent } from './no-content-template.component';
+
+export * from './datatable.component';
+export * from './no-content-template.component';
+
+export const ALFRESCO_DATATABLE_DIRECTIVES: [any] = [
+    DataTableComponent,
+    NoContentTemplateComponent
+];

ng2-components/ng2-alfresco-datatable/src/components/index.ts

@@ -0,0 +1,19 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './datatable/index';
+export * from './pagination/index';

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

@@ -0,0 +1,19 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './pagination-provider';
+export * from './pagination.component';

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

@@ -0,0 +1,47 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export interface PaginationProvider {
+
+    /**
+     *  The number of objects in the collection.
+     */
+    count: number;
+
+    /**
+     * A boolean value which is true if there are more entities in the collection beyond those in this response.
+     * A true value means a request with a larger value for the skipCount or the maxItems parameter will return more entities.
+     */
+    hasMoreItems: boolean;
+
+    /**
+     * An integer describing the total number of entities in the collection.
+     * The API might not be able to determine this value, in which case this property will not be present.
+     */
+    totalItems?: number;
+
+    /**
+     * An integer describing how many entities exist in the collection before those included in this list.
+     */
+    skipCount: number;
+
+    /**
+     * The value of the maxItems parameter used to generate this list,
+     * or if there was no maxItems parameter the default value is 100.
+     */
+    maxItems: number;
+}

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

@@ -0,0 +1,64 @@
+.mdl-paging {
+    color: rgba(0, 0, 0, 0.54);
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-justify-content: flex-end;
+    -ms-flex-pack: end;
+    justify-content: flex-end;
+    -webkit-align-items: center;
+    -ms-flex-align: center;
+    align-items: center;
+    height: 56px;
+    -webkit-flex-flow: row wrap;
+    -ms-flex-flow: row wrap;
+    flex-flow: row wrap;
+}
+
+.mdl-paging > * {
+    -webkit-flex: none;
+    -ms-flex: none;
+    flex: none;
+}
+
+.mdl-list + .mdl-paging {
+    margin: 0;
+}
+
+.mdl-paging__per-page {
+    position: relative;
+}
+
+.mdl-paging__per-page-label {
+    margin-right: 40px;
+}
+
+.mdl-paging__per-page-value {
+    position: absolute;
+    right: 36px;
+    top: 6px;
+}
+
+.mdl-paging__per-page + .mdl-paging__count {
+    margin-left: 24px;
+}
+
+.mdl-paging .mdl-menu {
+    min-width: 64px;
+}
+
+.mdl-paging__prev:last-child {
+    margin-right: 44px;
+}
+
+.mdl-paging__count + .mdl-paging__prev {
+    margin-left: 24px;
+}
+
+.mdl-paging__prev + .mdl-paging__next {
+    margin-left: 12px;
+}
+
+.mdl-paging__count + .mdl-paging__next {
+    margin-left: 68px;
+}

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

@@ -0,0 +1,27 @@
+<div *ngIf="provider" class="mdl-paging">
+    <span class="mdl-paging__per-page">
+        <span class="mdl-paging__per-page-label">Rows per page:</span>
+        <span class="mdl-paging__per-page-value">{{pageSize}}</span>
+        <button alfresco-mdl-button id="pageSizePicker" class="mdl-button--icon mdl-paging__per-page-dropdown">
+            <i class="material-icons">arrow_drop_down</i>
+        </button>
+        <ul alfresco-mdl-menu for="pageSizePicker" class="mdl-menu--bottom-right">
+            <li *ngFor="let size of supportedPageSizes"
+                tabindex="-1" [attr.data-value]="size" class="mdl-menu__item"
+                (click)="setPageSize(size)">
+                <span>{{size}}</span>
+            </li>
+        </ul>
+    </span>
+    <span class="mdl-paging__count">{{summary}}</span>
+    <button (click)="showPrevPage()"
+            [disabled]="!prevPageAvail"
+            alfresco-mdl-button class="mdl-button--icon mdl-paging__prev">
+        <i class="material-icons">keyboard_arrow_left</i>
+    </button>
+    <button (click)="showNextPage()"
+            [disabled]="!nextPageAvail"
+            alfresco-mdl-button class="mdl-button--icon mdl-paging__next">
+        <i class="material-icons">keyboard_arrow_right</i>
+    </button>
+</div>

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

@@ -0,0 +1,86 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Input } from '@angular/core';
+
+import { MATERIAL_DESIGN_DIRECTIVES } from 'ng2-alfresco-core';
+import { PaginationProvider } from './pagination-provider';
+
+declare let __moduleName: string;
+
+@Component({
+    moduleId: __moduleName,
+    selector: 'alfresco-pagination',
+    templateUrl: './pagination.component.html',
+    styleUrls: ['./pagination.component.css'],
+    directives: [MATERIAL_DESIGN_DIRECTIVES]
+})
+export class PaginationComponent {
+
+    DEFAULT_PAGE_SIZE: number = 20;
+
+    @Input()
+    supportedPageSizes: number[] = [5, 10, 20, 50, 100];
+
+    @Input()
+    provider: PaginationProvider;
+
+    get pageSize(): number {
+        if (this.provider) {
+            return this.provider.maxItems;
+        }
+        return this.DEFAULT_PAGE_SIZE;
+    }
+
+    set pageSize(value: number) {
+        if (this.provider) {
+            this.provider.maxItems = value;
+        }
+    }
+
+    setPageSize(value: number) {
+        this.pageSize = value;
+    }
+
+    get summary(): string {
+        let from = this.provider.skipCount;
+        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 {
+        return this.provider.hasMoreItems;
+    }
+
+    get prevPageAvail(): boolean {
+        return this.provider.skipCount > 0;
+    }
+
+    showNextPage() {
+        this.provider.skipCount += this.provider.maxItems;
+    }
+
+    showPrevPage() {
+        this.provider.skipCount -= this.provider.maxItems;
+    }
+}
+
+

ng2-components/ng2-alfresco-datatable/src/data/index.ts

@@ -0,0 +1,19 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './datatable-adapter';
+export * from './object-datatable-adapter';