{{'home.top-level-communities.head' | translate}}
{{'home.top-level-communities.help' | translate}}
--
-
-
-
- {{community.name}}
-
- {{community.shortDescription}} -
-
" + separator: string = "
"; collections: Observable
+ {{collection.shortDescription}}
+
diff --git a/src/app/object-list/collection-list-element/collection-list-element.component.scss b/src/app/object-list/collection-list-element/collection-list-element.component.scss
new file mode 100644
index 0000000000..ad84b72f8c
--- /dev/null
+++ b/src/app/object-list/collection-list-element/collection-list-element.component.scss
@@ -0,0 +1 @@
+@import '../../../styles/variables.scss';
\ No newline at end of file
diff --git a/src/app/object-list/collection-list-element/collection-list-element.component.ts b/src/app/object-list/collection-list-element/collection-list-element.component.ts
new file mode 100644
index 0000000000..c199994d5c
--- /dev/null
+++ b/src/app/object-list/collection-list-element/collection-list-element.component.ts
@@ -0,0 +1,23 @@
+import { Component, Input } from '@angular/core';
+import { Collection } from "../../core/shared/collection.model";
+
+@Component({
+ selector: 'ds-collection-list-element',
+ styleUrls: ['./collection-list-element.component.css'],
+ templateUrl: './collection-list-element.component.html'
+})
+export class CollectionListElementComponent {
+
+ @Input() collection: Collection;
+
+ data: any = {};
+
+ constructor() {
+ this.universalInit();
+ }
+
+ universalInit() {
+
+ }
+
+}
diff --git a/src/app/object-list/community-list-element/community-list-element.component.html b/src/app/object-list/community-list-element/community-list-element.component.html
new file mode 100644
index 0000000000..2c2f4fc35f
--- /dev/null
+++ b/src/app/object-list/community-list-element/community-list-element.component.html
@@ -0,0 +1,6 @@
+
+ {{community.name}}
+
+
+ {{community.shortDescription}}
+
diff --git a/src/app/object-list/community-list-element/community-list-element.component.scss b/src/app/object-list/community-list-element/community-list-element.component.scss
new file mode 100644
index 0000000000..ad84b72f8c
--- /dev/null
+++ b/src/app/object-list/community-list-element/community-list-element.component.scss
@@ -0,0 +1 @@
+@import '../../../styles/variables.scss';
\ No newline at end of file
diff --git a/src/app/object-list/community-list-element/community-list-element.component.ts b/src/app/object-list/community-list-element/community-list-element.component.ts
new file mode 100644
index 0000000000..36e8a06e0f
--- /dev/null
+++ b/src/app/object-list/community-list-element/community-list-element.component.ts
@@ -0,0 +1,23 @@
+import { Component, Input } from '@angular/core';
+import { Community } from "../../core/shared/community.model";
+
+@Component({
+ selector: 'ds-community-list-element',
+ styleUrls: ['./community-list-element.component.css'],
+ templateUrl: './community-list-element.component.html'
+})
+export class CommunityListElementComponent {
+
+ @Input() community: Community;
+
+ data: any = {};
+
+ constructor() {
+ this.universalInit();
+ }
+
+ universalInit() {
+
+ }
+
+}
diff --git a/src/app/object-list/item-list-element/item-list-element.component.html b/src/app/object-list/item-list-element/item-list-element.component.html
new file mode 100644
index 0000000000..517cae480f
--- /dev/null
+++ b/src/app/object-list/item-list-element/item-list-element.component.html
@@ -0,0 +1,14 @@
+
+ {{item.findMetadata("dc.title")}}
+
+
+
+
+ ({{item.findMetadata("dc.publisher")}}, {{item.findMetadata("dc.date.issued")}})
+
+
diff --git a/src/app/object-list/item-list-element/item-list-element.component.scss b/src/app/object-list/item-list-element/item-list-element.component.scss
new file mode 100644
index 0000000000..ad84b72f8c
--- /dev/null
+++ b/src/app/object-list/item-list-element/item-list-element.component.scss
@@ -0,0 +1 @@
+@import '../../../styles/variables.scss';
\ No newline at end of file
diff --git a/src/app/object-list/item-list-element/item-list-element.component.ts b/src/app/object-list/item-list-element/item-list-element.component.ts
new file mode 100644
index 0000000000..3f09cc200c
--- /dev/null
+++ b/src/app/object-list/item-list-element/item-list-element.component.ts
@@ -0,0 +1,22 @@
+import { Component, Input } from '@angular/core';
+import { Item } from "../../core/shared/item.model";
+
+@Component({
+ selector: 'ds-item-list-element',
+ styleUrls: ['./item-list-element.component.css'],
+ templateUrl: './item-list-element.component.html'
+})
+export class ItemListElementComponent {
+ @Input() item: Item;
+
+ data: any = {};
+
+ constructor() {
+ this.universalInit();
+ }
+
+ universalInit() {
+
+ }
+
+}
diff --git a/src/app/object-list/object-list-element/object-list-element.component.html b/src/app/object-list/object-list-element/object-list-element.component.html
new file mode 100644
index 0000000000..5feb69b3a6
--- /dev/null
+++ b/src/app/object-list/object-list-element/object-list-element.component.html
@@ -0,0 +1,5 @@
+{{item.findMetadata("dc.description.abstract") | dsTruncate:[200] }}
+
+
\ No newline at end of file
diff --git a/src/app/object-list/object-list-element/object-list-element.component.scss b/src/app/object-list/object-list-element/object-list-element.component.scss
new file mode 100644
index 0000000000..6bdc45f30f
--- /dev/null
+++ b/src/app/object-list/object-list-element/object-list-element.component.scss
@@ -0,0 +1,7 @@
+@import '../../../styles/variables.scss';
+@import '../../../../node_modules/bootstrap/scss/variables';
+
+:host {
+ display: block;
+ margin-bottom: $spacer-y;
+}
diff --git a/src/app/object-list/object-list-element/object-list-element.component.ts b/src/app/object-list/object-list-element/object-list-element.component.ts
new file mode 100644
index 0000000000..8b53ca5d6a
--- /dev/null
+++ b/src/app/object-list/object-list-element/object-list-element.component.ts
@@ -0,0 +1,26 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { DSpaceObject } from "../../core/shared/dspace-object.model";
+import { ResourceType } from "../../core/shared/resource-type";
+
+@Component({
+ selector: 'ds-object-list-element',
+ styleUrls: ['./object-list-element.component.css'],
+ templateUrl: './object-list-element.component.html'
+})
+export class ObjectListElementComponent {
+
+ public type = ResourceType;
+
+ @Input() object: DSpaceObject;
+
+ data: any = {};
+
+ constructor() {
+ this.universalInit();
+ }
+
+ universalInit() {
+
+ }
+
+}
diff --git a/src/app/object-list/object-list.component.html b/src/app/object-list/object-list.component.html
new file mode 100644
index 0000000000..b0ca991a93
--- /dev/null
+++ b/src/app/object-list/object-list.component.html
@@ -0,0 +1,16 @@
+-
+
-
+
+
+
- ![]()
-
\ No newline at end of file
+
+
@@ -18,7 +20,7 @@
@@ -9,7 +9,9 @@
+
(html: string, type: {new (...args: any[]): T}): ComponentFixture {
@@ -138,7 +140,7 @@ describe('Pagination component', () => {
RouterTestingModule.withRoutes([
{path: 'home', component: TestComponent}
])],
- declarations: [PaginationComponent, TestComponent], // declare the test component
+ declarations: [PaginationComponent, TestComponent, EnumKeysPipe], // declare the test component
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: GLOBAL_CONFIG, useValue: EnvConfig },
@@ -156,6 +158,7 @@ describe('Pagination component', () => {
html = `
@@ -247,12 +250,12 @@ describe('Pagination component', () => {
changePage(testFixture, 3);
tick();
- expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 10 } });
+ expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 10, sortDirection: 0, sortField: 'name' } });
expect(paginationComponent.currentPage).toEqual(3);
changePageSize(testFixture, '20');
tick();
- expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 20 } });
+ expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 20, sortDirection: 0, sortField: 'name' } });
expect(paginationComponent.pageSize).toEqual(20);
}));
@@ -307,7 +310,8 @@ class TestComponent {
collection: string[] = [];
collectionSize: number;
- paginationOptions = new PaginationOptions();
+ paginationOptions = new PaginationComponentOptions();
+ sortOptions = new SortOptions();
constructor() {
this.collection = Array.from(new Array(100), (x, i) => `item ${i + 1}`);
diff --git a/src/app/shared/pagination/pagination.component.ts b/src/app/shared/pagination/pagination.component.ts
index cb1155f652..47b8729fb4 100644
--- a/src/app/shared/pagination/pagination.component.ts
+++ b/src/app/shared/pagination/pagination.component.ts
@@ -1,14 +1,15 @@
import {
- ChangeDetectionStrategy,
- Component,
- EventEmitter,
- Input,
- OnDestroy,
- OnInit,
- Output,
- ViewEncapsulation
+ ChangeDetectionStrategy,
+ Component,
+ EventEmitter,
+ Input,
+ OnDestroy,
+ OnInit,
+ Output,
+ ViewEncapsulation
} from '@angular/core'
import { ActivatedRoute, Router } from '@angular/router';
+import { Subscription } from "rxjs/Subscription";
import { isNumeric } from "rxjs/util/isNumeric";
import 'rxjs/add/operator/switchMap';
import { Observable } from "rxjs";
@@ -17,231 +18,338 @@ import { DEFAULT_TEMPLATE, DEFAULT_STYLES } from 'ng2-pagination/dist/template';
import { HostWindowService } from "../host-window.service";
import { HostWindowState } from "../host-window.reducer";
-import { PaginationOptions } from '../../core/cache/models/pagination-options.model';
+import { PaginationComponentOptions } from './pagination-component-options.model';
+import { SortDirection, SortOptions } from "../../core/cache/models/sort-options.model";
+import { hasValue } from "../empty.util";
/**
* The default pagination controls component.
*/
@Component({
- exportAs: 'paginationComponent',
- selector: 'ds-pagination',
- templateUrl: 'pagination.component.html',
- changeDetection: ChangeDetectionStrategy.Default,
- encapsulation: ViewEncapsulation.Emulated
+ exportAs: 'paginationComponent',
+ selector: 'ds-pagination',
+ templateUrl: 'pagination.component.html',
+ changeDetection: ChangeDetectionStrategy.Default,
+ encapsulation: ViewEncapsulation.Emulated
})
export class PaginationComponent implements OnDestroy, OnInit {
- /**
- * Number of items in collection.
- */
- @Input() collectionSize: number;
+ /**
+ * Number of items in collection.
+ */
+ @Input() collectionSize: number;
+
+ /**
+ * Configuration for the NgbPagination component.
+ */
+ @Input() paginationOptions: PaginationComponentOptions;
+
+ /**
+ * Sort configuration for this component.
+ */
+ @Input() sortOptions: SortOptions;
+
+ /**
+ * An event fired when the page is changed.
+ * Event's payload equals to the newly selected page.
+ */
+ @Output() pageChange: EventEmitter = new EventEmitter();
+
+ /**
+ * An event fired when the page wsize is changed.
+ * Event's payload equals to the newly selected page size.
+ */
+ @Output() pageSizeChange: EventEmitter = new EventEmitter();
+
+ /**
+ * An event fired when the sort direction is changed.
+ * Event's payload equals to the newly selected sort direction.
+ */
+ @Output() sortDirectionChange: EventEmitter = new EventEmitter();
+
+ /**
+ * An event fired when the sort field is changed.
+ * Event's payload equals to the newly selected sort field.
+ */
+ @Output() sortFieldChange: EventEmitter = new EventEmitter();
+
+
+ /**
+ * Option for hiding the gear
+ */
+ @Input() public hideGear: boolean = false;
+
+ /**
+ * Option for hiding the pager when there is less than 2 pages
+ */
+ @Input() public hidePagerWhenSinglePage: boolean = true;
+
+ /**
+ * Current page.
+ */
+ public currentPage = 1;
+
+ /**
+ * Current URL query parameters
+ */
+ public currentQueryParams = {};
+
+ /**
+ * An observable of HostWindowState type
+ */
+ public hostWindow: Observable;
+
+ /**
+ * ID for the pagination instance. Only useful if you wish to
+ * have more than once instance at a time in a given component.
+ */
+ private id: string;
+
+ /**
+ * A boolean that indicate if is an extra small devices viewport.
+ */
+ public isXs: boolean;
+
+ /**
+ * Number of items per page.
+ */
+ public pageSize: number = 10;
+
+ /**
+ * Declare SortDirection enumeration to use it in the template
+ */
+ public sortDirections = SortDirection
+
+ /**
+ * A number array that represents options for a context pagination limit.
+ */
+ private pageSizeOptions: Array;
+
+ /**
+ * Direction in which to sort: ascending or descending
+ */
+ public sortDirection: SortDirection = SortDirection.Ascending;
+
+ /**
+ * Name of the field that's used to sort by
+ */
+ public sortField: string = "id";
+
+ /**
+ * Local variable, which can be used in the template to access the paginate controls ngbDropdown methods and properties
+ */
+ public paginationControls;
/**
- * Configuration for the NgbPagination component.
+ * Array to track all subscriptions and unsubscribe them onDestroy
+ * @type {Array}
*/
- @Input() paginationOptions: PaginationOptions;
+ private subs: Subscription[] = [];
/**
- * An event fired when the page is changed.
- * Event's payload equals to the newly selected page.
- */
- @Output() pageChange: EventEmitter = new EventEmitter();
+ * An object that represents pagination details of the current viewed page
+ */
+ public showingDetail: any = {
+ range: null,
+ total: null
+ };
- /**
- * An event fired when the page size is changed.
- * Event's payload equals to the newly selected page size.
- */
- @Output() pageSizeChange: EventEmitter = new EventEmitter();
+ /**
+ * Method provided by Angular. Invoked after the constructor.
+ */
+ ngOnInit() {
+ this.subs.push(this.hostWindowService.isXs()
+ .subscribe((status: boolean) => {
+ this.isXs = status;
+ }));
+ this.checkConfig(this.paginationOptions);
+ this.id = this.paginationOptions.id || null;
+ this.currentPage = this.paginationOptions.currentPage;
+ this.pageSize = this.paginationOptions.pageSize;
+ this.pageSizeOptions = this.paginationOptions.pageSizeOptions;
+ this.sortDirection = this.sortOptions.direction;
+ this.sortField = this.sortOptions.field;
+ this.subs.push(this.route.queryParams
+ .filter(queryParams => hasValue(queryParams))
+ .subscribe(queryParams => {
+ this.currentQueryParams = queryParams;
+ if (this.id == queryParams['pageId']
+ && (this.paginationOptions.currentPage != queryParams['page']
+ || this.paginationOptions.pageSize != queryParams['pageSize']
+ || this.sortOptions.direction != queryParams['sortDirection']
+ || this.sortOptions.field != queryParams['sortField'] )
+ ) {
+ this.validateParams(queryParams['page'], queryParams['pageSize'], queryParams['sortDirection'], queryParams['sortField']);
+ }
+ }));
+ this.setShowingDetail();
+ }
- /**
- * Current page.
- */
- public currentPage = 1;
-
- /**
- * Current URL query parameters
- */
- public currentQueryParams = {};
+ /**
+ * Method provided by Angular. Invoked when the instance is destroyed.
+ */
+ ngOnDestroy() {
+ this.subs
+ .filter(sub => hasValue(sub))
+ .forEach(sub => sub.unsubscribe());
+ }
- /**
- * An observable of HostWindowState type
- */
- public hostWindow: Observable;
+ /**
+ * @param route
+ * Route is a singleton service provided by Angular.
+ * @param router
+ * Router is a singleton service provided by Angular.
+ */
+ constructor(private route: ActivatedRoute,
+ private router: Router,
+ public hostWindowService: HostWindowService) {
+ }
- /**
- * ID for the pagination instance. Only useful if you wish to
- * have more than once instance at a time in a given component.
- */
- private id: string;
+ /**
+ * Method to set set new page and update route parameters
+ *
+ * @param page
+ * The page being navigated to.
+ */
+ public doPageChange(page: number) {
+ this.currentPage = page;
+ this.updateRoute();
+ this.setShowingDetail();
+ this.pageChange.emit(page);
+ }
- /**
- * A boolean that indicate if is an extra small devices viewport.
- */
- public isXs: boolean;
+ /**
+ * Method to set set new page size and update route parameters
+ *
+ * @param pageSize
+ * The new page size.
+ */
+ public setPageSize(pageSize: number) {
+ this.pageSize = pageSize;
+ this.updateRoute();
+ this.setShowingDetail();
+ this.pageSizeChange.emit(pageSize);
+ }
- /**
- * Number of items per page.
- */
- public pageSize: number = 10;
+ /**
+ * Method to set set new sort direction and update route parameters
+ *
+ * @param sortDirection
+ * The new sort direction.
+ */
+ public setSortDirection(sortDirection: SortDirection) {
+ this.sortDirection = sortDirection;
+ this.updateRoute();
+ this.setShowingDetail();
+ this.sortDirectionChange.emit(sortDirection);
+ }
- /**
- * A number array that represents options for a context pagination limit.
- */
- private pageSizeOptions: Array;
+ /**
+ * Method to set set new sort field and update route parameters
+ *
+ * @param sortField
+ * The new sort field.
+ */
+ public setSortField(field: string) {
+ this.sortField = field;
+ this.updateRoute();
+ this.setShowingDetail();
+ this.sortFieldChange.emit(field);
+ }
- /**
- * Local variable, which can be used in the template to access the paginate controls ngbDropdown methods and properties
- */
- public paginationControls;
+ /**
+ * Method to update the route parameters
+ */
+ private updateRoute() {
+ this.router.navigate([], {
+ queryParams: Object.assign({}, this.currentQueryParams, {
+ pageId: this.id,
+ page: this.currentPage,
+ pageSize: this.pageSize,
+ sortDirection: this.sortDirection,
+ sortField: this.sortField
+ })
+ });
+ }
- /**
- * Subscriber to observable.
- */
- private routeSubscription: any;
+ /**
+ * Method to set pagination details of the current viewed page.
+ */
+ private setShowingDetail() {
+ let firstItem;
+ let lastItem;
+ let lastPage = Math.round(this.collectionSize / this.pageSize);
- /**
- * An object that represents pagination details of the current viewed page
- */
- public showingDetail: any = {
- range: null,
- total: null
- };
-
- /**
- * Subscriber to observable.
- */
- private stateSubscription: any;
-
- /**
- * Method provided by Angular. Invoked after the constructor.
- */
- ngOnInit() {
- this.stateSubscription = this.hostWindowService.isXs()
- .subscribe((status: boolean) => {
- this.isXs = status;
- });
- this.checkConfig(this.paginationOptions);
- this.id = this.paginationOptions.id || null;
- this.currentPage = this.paginationOptions.currentPage;
- this.pageSize = this.paginationOptions.pageSize;
- this.pageSizeOptions = this.paginationOptions.pageSizeOptions;
-
- this.routeSubscription = this.route.queryParams
- .map(queryParams => queryParams)
- .subscribe(queryParams => {
- this.currentQueryParams = queryParams;
- if(this.id == queryParams['pageId']
- && (this.paginationOptions.currentPage != queryParams['page']
- || this.paginationOptions.pageSize != queryParams['pageSize'])
- ) {
- this.validateParams(queryParams['page'], queryParams['pageSize']);
+ firstItem = this.pageSize * (this.currentPage - 1) + 1;
+ if (this.currentPage != lastPage) {
+ lastItem = this.pageSize * this.currentPage;
+ } else {
+ lastItem = this.collectionSize;
+ }
+ this.showingDetail = {
+ range: firstItem + ' - ' + lastItem,
+ total: this.collectionSize
}
- });
- this.setShowingDetail();
- }
-
- /**
- * Method provided by Angular. Invoked when the instance is destroyed.
- */
- ngOnDestroy() {
- this.stateSubscription.unsubscribe();
- this.routeSubscription.unsubscribe();
- }
-
- /**
- * @param route
- * Route is a singleton service provided by Angular.
- * @param router
- * Router is a singleton service provided by Angular.
- */
- constructor(
- private route: ActivatedRoute,
- private router: Router,
- public hostWindowService: HostWindowService
- ){
- }
-
- /**
- * Method to set set new page and update route parameters
- *
- * @param page
- * The page being navigated to.
- */
- public doPageChange(page: number) {
- this.router.navigate([], { queryParams: Object.assign({}, this.currentQueryParams, { pageId: this.id, page: page, pageSize: this.pageSize }) });
- this.currentPage = page;
- this.setShowingDetail();
- this.pageChange.emit(page);
- }
-
- /**
- * Method to set set new page size and update route parameters
- *
- * @param pageSize
- * The new page size.
- */
- public setPageSize(pageSize: number) {
- this.router.navigate([], { queryParams: Object.assign({}, this.currentQueryParams, { pageId: this.id, page: this.currentPage, pageSize: pageSize }) });
- this.pageSize = pageSize;
- this.setShowingDetail();
- this.pageSizeChange.emit(pageSize);
- }
-
- /**
- * Method to set pagination details of the current viewed page.
- */
- private setShowingDetail() {
- let firstItem;
- let lastItem;
- let lastPage = Math.round(this.collectionSize / this.pageSize);
-
- firstItem = this.pageSize * (this.currentPage - 1) + 1;
- if (this.currentPage != lastPage) {
- lastItem = this.pageSize * this.currentPage;
- } else {
- lastItem = this.collectionSize;
}
- this.showingDetail = {
- range: firstItem + ' - ' + lastItem,
- total: this.collectionSize
- }
- }
- /**
- * Validate query params
- *
- * @param page
- * The page number to validate
- * @param pageSize
- * The page size to validate
- */
- private validateParams(page: any, pageSize: any) {
- let filteredPageSize = this.pageSizeOptions.find(x => x == pageSize);
- if (!isNumeric(page) || !filteredPageSize) {
- let filteredPage = isNumeric(page) ? page : this.currentPage;
- filteredPageSize = (filteredPageSize) ? filteredPageSize : this.pageSize;
- this.router.navigate([{ pageId: this.id, page: filteredPage, pageSize: filteredPageSize }]);
- } else {
- // (+) converts string to a number
- this.currentPage = +page;
- this.pageSize = +pageSize;
- this.pageChange.emit(this.currentPage);
- this.pageSizeChange.emit(this.pageSize);
+ /**
+ * Validate query params
+ *
+ * @param page
+ * The page number to validate
+ * @param pageSize
+ * The page size to validate
+ */
+ private validateParams(page: any, pageSize: any, sortDirection: any, sortField: any) {
+ let filteredPageSize = this.pageSizeOptions.find(x => x == pageSize);
+ if (!isNumeric(page) || !filteredPageSize) {
+ let filteredPage = isNumeric(page) ? page : this.currentPage;
+ filteredPageSize = (filteredPageSize) ? filteredPageSize : this.pageSize;
+ this.router.navigate([], {
+ queryParams: {
+ pageId: this.id,
+ page: filteredPage,
+ pageSize: filteredPageSize,
+ sortDirection: sortDirection,
+ sortField: sortField
+ }
+ }
+ );
+ } else {
+ // (+) converts string to a number
+ this.currentPage = +page;
+ this.pageSize = +pageSize;
+ this.sortDirection = +sortDirection;
+ this.sortField = sortField;
+ this.pageChange.emit(this.currentPage);
+ this.pageSizeChange.emit(this.pageSize);
+ this.sortDirectionChange.emit(this.sortDirection);
+ this.sortFieldChange.emit(this.sortField);
+ }
}
- }
- /**
- * Ensure options passed contains the required properties.
- *
- * @param paginateOptions
- * The paginate options object.
- */
- private checkConfig(paginateOptions: any) {
- let required = ['id', 'currentPage', 'pageSize', 'pageSizeOptions'];
- let missing = required.filter(function (prop) { return !(prop in paginateOptions); });
- if (0 < missing.length) {
- throw new Error("Paginate: Argument is missing the following required properties: " + missing.join(', '));
+ /**
+ * Ensure options passed contains the required properties.
+ *
+ * @param paginateOptions
+ * The paginate options object.
+ */
+ private checkConfig(paginateOptions: any) {
+ let required = ['id', 'currentPage', 'pageSize', 'pageSizeOptions'];
+ let missing = required.filter(function (prop) {
+ return !(prop in paginateOptions);
+ });
+ if (0 < missing.length) {
+ throw new Error("Paginate: Argument is missing the following required properties: " + missing.join(', '));
+ }
+ }
+
+ get hasMultiplePages(): boolean {
+ return this.collectionSize > this.pageSize;
+ }
+
+ get shouldShowBottomPager(): boolean {
+ return this.hasMultiplePages || !this.hidePagerWhenSinglePage
}
- }
}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 817ae5f26e..5b3e20fee2 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -17,6 +17,13 @@ import { NativeWindowFactory, NativeWindowService } from "./window.service";
import { ComcolPageContentComponent } from "./comcol-page-content/comcol-page-content.component";
import { ComcolPageHeaderComponent } from "./comcol-page-header/comcol-page-header.component";
import { ComcolPageLogoComponent } from "./comcol-page-logo/comcol-page-logo.component";
+import { EnumKeysPipe } from "./utils/enum-keys-pipe";
+import { ObjectListComponent } from "./object-list/object-list.component";
+import { ObjectListElementComponent } from "../object-list/object-list-element/object-list-element.component";
+import { ItemListElementComponent } from "../object-list/item-list-element/item-list-element.component";
+import { CommunityListElementComponent } from "../object-list/community-list-element/community-list-element.component";
+import { CollectionListElementComponent } from "../object-list/collection-list-element/collection-list-element.component";
+import { TruncatePipe } from "./utils/truncate.pipe";
const MODULES = [
// Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -31,7 +38,9 @@ const MODULES = [
const PIPES = [
FileSizePipe,
- SafeUrlPipe
+ SafeUrlPipe,
+ EnumKeysPipe,
+ TruncatePipe
// put pipes here
];
@@ -41,7 +50,12 @@ const COMPONENTS = [
ThumbnailComponent,
ComcolPageContentComponent,
ComcolPageHeaderComponent,
- ComcolPageLogoComponent
+ ComcolPageLogoComponent,
+ ObjectListComponent,
+ ObjectListElementComponent,
+ ItemListElementComponent,
+ CollectionListElementComponent,
+ CommunityListElementComponent
];
const PROVIDERS = [
diff --git a/src/app/shared/utils/enum-keys-pipe.ts b/src/app/shared/utils/enum-keys-pipe.ts
new file mode 100644
index 0000000000..5854b77b4d
--- /dev/null
+++ b/src/app/shared/utils/enum-keys-pipe.ts
@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from "@angular/core";
+@Pipe({ name: 'dsKeys' })
+export class EnumKeysPipe implements PipeTransform {
+ transform(value, args: string[]): any {
+ let keys = [];
+ for (var enumMember in value) {
+ if (!isNaN(parseInt(enumMember, 10))) {
+ keys.push({ key: +enumMember, value: value[enumMember] });
+ }
+ }
+ return keys;
+ }
+}
\ No newline at end of file
diff --git a/src/app/shared/utils/truncate.pipe.ts b/src/app/shared/utils/truncate.pipe.ts
new file mode 100644
index 0000000000..dffc9750d1
--- /dev/null
+++ b/src/app/shared/utils/truncate.pipe.ts
@@ -0,0 +1,26 @@
+import { Pipe, PipeTransform } from '@angular/core'
+import { hasValue } from "../empty.util";
+
+/**
+ * Pipe to truncate a value in Angular. (Take a substring, starting at 0)
+ * Default value: 10
+ */
+@Pipe({
+ name: 'dsTruncate'
+})
+export class TruncatePipe implements PipeTransform {
+
+ /**
+ *
+ */
+ transform(value: string, args: Array) : string {
+ if (hasValue(value)) {
+ let limit = (args && args.length > 0) ? parseInt(args[0], 10) : 10; // 10 as default truncate value
+ return value.length > limit ? value.substring(0, limit) + "..." : value;
+ }
+ else {
+ return value;
+ }
+ }
+
+}
diff --git a/src/app/thumbnail/thumbnail.component.html b/src/app/thumbnail/thumbnail.component.html
index 757c1b8e4e..669278b416 100644
--- a/src/app/thumbnail/thumbnail.component.html
+++ b/src/app/thumbnail/thumbnail.component.html
@@ -1,4 +1,4 @@
![]()
+ ![]()
+
diff --git a/src/app/thumbnail/thumbnail.component.ts b/src/app/thumbnail/thumbnail.component.ts
index 61b9e31fbe..fecfe7e248 100644
--- a/src/app/thumbnail/thumbnail.component.ts
+++ b/src/app/thumbnail/thumbnail.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input } from '@angular/core';
import { Bitstream } from "../core/shared/bitstream.model";
/**
@@ -14,21 +14,24 @@ import { Bitstream } from "../core/shared/bitstream.model";
})
export class ThumbnailComponent {
- @Input() thumbnail: Bitstream;
+ @Input() thumbnail: Bitstream;
- data: any = {};
+ data: any = {};
- /**
- * The default 'holder.js' image
- */
- holderSource: string = "data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2293%22%20height%3D%22120%22%20viewBox%3D%220%200%2093%20120%22%20preserveAspectRatio%3D%22none%22%3E%3C!--%0ASource%20URL%3A%20holder.js%2F93x120%3Ftext%3DNo%20Thumbnail%0ACreated%20with%20Holder.js%202.8.2.%0ALearn%20more%20at%20http%3A%2F%2Fholderjs.com%0A(c)%202012-2015%20Ivan%20Malopinsky%20-%20http%3A%2F%2Fimsky.co%0A--%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%3C!%5BCDATA%5B%23holder_1543e460b05%20text%20%7B%20fill%3A%23AAAAAA%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A10pt%20%7D%20%5D%5D%3E%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_1543e460b05%22%3E%3Crect%20width%3D%2293%22%20height%3D%22120%22%20fill%3D%22%23EEEEEE%22%2F%3E%3Cg%3E%3Ctext%20x%3D%2235.6171875%22%20y%3D%2257%22%3ENo%3C%2Ftext%3E%3Ctext%20x%3D%2210.8125%22%20y%3D%2272%22%3EThumbnail%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E";
+ /**
+ * The default 'holder.js' image
+ */
+ holderSource: string = "data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2293%22%20height%3D%22120%22%20viewBox%3D%220%200%2093%20120%22%20preserveAspectRatio%3D%22none%22%3E%3C!--%0ASource%20URL%3A%20holder.js%2F93x120%3Ftext%3DNo%20Thumbnail%0ACreated%20with%20Holder.js%202.8.2.%0ALearn%20more%20at%20http%3A%2F%2Fholderjs.com%0A(c)%202012-2015%20Ivan%20Malopinsky%20-%20http%3A%2F%2Fimsky.co%0A--%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%3C!%5BCDATA%5B%23holder_1543e460b05%20text%20%7B%20fill%3A%23AAAAAA%3Bfont-weight%3Abold%3Bfont-family%3AArial%2C%20Helvetica%2C%20Open%20Sans%2C%20sans-serif%2C%20monospace%3Bfont-size%3A10pt%20%7D%20%5D%5D%3E%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_1543e460b05%22%3E%3Crect%20width%3D%2293%22%20height%3D%22120%22%20fill%3D%22%23EEEEEE%22%2F%3E%3Cg%3E%3Ctext%20x%3D%2235.6171875%22%20y%3D%2257%22%3ENo%3C%2Ftext%3E%3Ctext%20x%3D%2210.8125%22%20y%3D%2272%22%3EThumbnail%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E";
- constructor() {
- this.universalInit();
- }
+ constructor() {
+ this.universalInit();
+ }
- universalInit() {
+ universalInit() {
+ }
- }
+ errorHandler(event) {
+ event.currentTarget.src = this.holderSource;
+ }
}
- ![]()
- ![]()
-
\ No newline at end of file
+