Merge branch 'master' into post-support

This commit is contained in:
Art Lowel
2018-01-17 15:34:54 +01:00
111 changed files with 1483 additions and 199 deletions

1
.gitignore vendored
View File

@@ -14,6 +14,7 @@ npm-debug.log
/coverage/
.idea
*.iml
*.ngfactory.ts
*.css.shim.ts
*.scss.shim.ts

View File

@@ -41,13 +41,13 @@
<ng-container *ngVar="(itemRDObs | async) as itemRD">
<div *ngIf="itemRD?.hasSucceeded" @fadeIn>
<h2>{{'collection.page.browse.recent.head' | translate}}</h2>
<ds-object-list
<ds-viewable-collection
[config]="paginationConfig"
[sortConfig]="sortConfig"
[objects]="itemRD"
[hideGear]="false"
(paginationChange)="onPaginationChange($event)">
</ds-object-list>
</ds-viewable-collection>
</div>
<ds-error *ngIf="itemRD?.hasFailed" message="{{'error.recent-submissions' | translate}}"></ds-error>
<ds-loading *ngIf="!itemRD || itemRD.isLoading" message="{{'loading.recent-submissions' | translate}}"></ds-loading>

View File

@@ -1,15 +1,13 @@
<ng-container *ngVar="(communitiesRDObs | async) as communitiesRD">
<div *ngIf="communitiesRD?.hasSucceeded" @fadeInOut>
<div *ngIf="communitiesRD?.hasSucceeded " @fadeInOut>
<h2>{{'home.top-level-communities.head' | translate}}</h2>
<p class="lead">{{'home.top-level-communities.help' | translate}}</p>
<ds-object-list
<ds-viewable-collection
[config]="config"
[sortConfig]="sortConfig"
[objects]="communitiesRD"
[hideGear]="true"
(paginationChange)="updatePage($event)">
</ds-object-list>
</div>
<ds-error *ngIf="communitiesRD?.hasFailed" message="{{'error.top-level-communites' | translate}}"></ds-error>
<ds-loading *ngIf="communitiesRD?.isLoading" message="{{'loading.top-level-communities' | translate}}"></ds-loading>
</ng-container>
</ds-viewable-collection>
</div>
<ds-error *ngIf="communitiesRD?.hasFailed " message="{{'error.top-level-communites' | translate}}"></ds-error>
<ds-loading *ngIf="communitiesRD?.isLoading " message="{{'loading.top-level-communities' | translate}}"></ds-loading></ng-container>

View File

@@ -29,8 +29,8 @@
| translate}}
</button>
</div>
<ds-search-results [searchResults]="(resultsRDObs | async)"
[searchConfig]="searchOptions"></ds-search-results>
<ds-search-results [searchResults]="resultsRDObs | async"
[searchConfig]="searchOptions" [sortConfig]="sortConfig"></ds-search-results>
</div>
</div>
</div>

View File

@@ -1,17 +1,19 @@
import { ChangeDetectionStrategy, Component, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { SortOptions } from '../core/cache/models/sort-options.model';
import { CommunityDataService } from '../core/data/community-data.service';
import { PaginatedList } from '../core/data/paginated-list';
import { RemoteData } from '../core/data/remote-data';
import { Community } from '../core/shared/community.model';
import { DSpaceObject } from '../core/shared/dspace-object.model';
import { pushInOut } from '../shared/animations/push';
import { isNotEmpty } from '../shared/empty.util';
import { SearchOptions } from './search-options.model';
import { HostWindowService } from '../shared/host-window.service';
import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
import { SearchOptions, ViewMode } from './search-options.model';
import { SearchResult } from './search-result.model';
import { SearchService } from './search-service/search.service';
import { pushInOut } from '../shared/animations/push';
import { HostWindowService } from '../shared/host-window.service';
import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
/**
@@ -37,6 +39,7 @@ export class SearchPageComponent implements OnInit, OnDestroy {
resultsRDObs: Observable<RemoteData<Array<SearchResult<DSpaceObject>>>>;
currentParams = {};
searchOptions: SearchOptions;
sortConfig: SortOptions;
scopeListRDObs: Observable<RemoteData<PaginatedList<Community>>>;
isMobileView: Observable<boolean>;
@@ -52,6 +55,13 @@ export class SearchPageComponent implements OnInit, OnDestroy {
);
this.scopeListRDObs = communityService.findAll();
// Initial pagination config
const pagination: PaginationComponentOptions = new PaginationComponentOptions();
pagination.id = 'search-results-pagination';
pagination.currentPage = 1;
pagination.pageSize = 10;
const sort: SortOptions = new SortOptions();
this.sortConfig = sort;
this.searchOptions = this.service.searchOptions;
}
@@ -64,16 +74,31 @@ export class SearchPageComponent implements OnInit, OnDestroy {
this.query = params.query || '';
this.scope = params.scope;
const page = +params.page || this.searchOptions.pagination.currentPage;
const pageSize = +params.pageSize || this.searchOptions.pagination.pageSize;
let pageSize = +params.pageSize || this.searchOptions.pagination.pageSize;
let pageSizeOptions: number[] = [5, 10, 20, 40, 60, 80, 100];
if (isNotEmpty(params.view) && params.view === ViewMode.Grid) {
pageSizeOptions = [12, 24, 36, 48 , 50, 62, 74, 84];
if (pageSizeOptions.indexOf(pageSize) === -1) {
pageSize = 12;
}
}
if (isNotEmpty(params.view) && params.view === ViewMode.List) {
if (pageSizeOptions.indexOf(pageSize) === -1) {
pageSize = 10;
}
}
const sortDirection = +params.sortDirection || this.searchOptions.sort.direction;
const pagination = Object.assign({},
this.searchOptions.pagination,
{ currentPage: page, pageSize: pageSize }
{ currentPage: page, pageSize: pageSize, pageSizeOptions: pageSizeOptions}
);
const sort = Object.assign({},
this.searchOptions.sort,
{ direction: sortDirection, field: params.sortField }
);
this.updateSearchResults({
pagination: pagination,
sort: sort
@@ -89,6 +114,7 @@ export class SearchPageComponent implements OnInit, OnDestroy {
private updateSearchResults(searchOptions) {
this.resultsRDObs = this.service.search(this.query, this.scope, searchOptions);
this.searchOptions = searchOptions;
}
ngOnDestroy() {

View File

@@ -4,9 +4,12 @@ import { SharedModule } from '../shared/shared.module';
import { SearchPageRoutingModule } from './search-page-routing.module';
import { SearchPageComponent } from './search-page.component';
import { SearchResultsComponent } from './search-results/search-results.component';
import { ItemSearchResultListElementComponent } from '../object-list/search-result-list-element/item-search-result/item-search-result-list-element.component';
import { CollectionSearchResultListElementComponent } from '../object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component';
import { CommunitySearchResultListElementComponent } from '../object-list/search-result-list-element/community-search-result/community-search-result-list-element.component';
import { ItemSearchResultListElementComponent } from '../shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component';
import { CollectionSearchResultListElementComponent } from '../shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component';
import { CommunitySearchResultListElementComponent } from '../shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component';
import { ItemSearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component';
import { CommunitySearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component'
import { CollectionSearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component';
import { SearchService } from './search-service/search.service';
import { SearchSidebarComponent } from './search-sidebar/search-sidebar.component';
import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
@@ -37,6 +40,10 @@ const effects = [
ItemSearchResultListElementComponent,
CollectionSearchResultListElementComponent,
CommunitySearchResultListElementComponent,
ItemSearchResultGridElementComponent,
CollectionSearchResultGridElementComponent,
CommunitySearchResultGridElementComponent,
CommunitySearchResultListElementComponent,
SearchFiltersComponent,
SearchFilterComponent,
SearchFacetFilterComponent
@@ -49,7 +56,11 @@ const effects = [
entryComponents: [
ItemSearchResultListElementComponent,
CollectionSearchResultListElementComponent,
CommunitySearchResultListElementComponent
CommunitySearchResultListElementComponent,
ItemSearchResultGridElementComponent,
CollectionSearchResultGridElementComponent,
CommunitySearchResultGridElementComponent,
]
})
export class SearchPageModule { }
export class SearchPageModule {
}

View File

@@ -1,6 +1,6 @@
import { DSpaceObject } from '../core/shared/dspace-object.model';
import { Metadatum } from '../core/shared/metadatum.model';
import { ListableObject } from '../object-list/listable-object/listable-object.model';
import { ListableObject } from '../shared/object-collection/shared/listable-object.model';
export class SearchResult<T extends DSpaceObject> implements ListableObject {

View File

@@ -1,10 +1,10 @@
<div *ngIf="searchResults?.hasSucceeded" @fadeIn>
<h2 *ngIf="searchResults?.payload ?.length > 0">{{ 'search.results.head' | translate }}</h2>
<ds-object-list
<ds-viewable-collection
[config]="searchConfig.pagination"
[sortConfig]="searchConfig.sort"
[objects]="searchResults"
[hideGear]="true">
</ds-object-list></div>
</ds-viewable-collection></div>
<ds-loading *ngIf="searchResults?.isLoading" message="{{'loading.search-results' | translate}}"></ds-loading>
<ds-error *ngIf="searchResults?.hasFailed" message="{{'error.search-results' | translate}}"></ds-error>

View File

@@ -2,7 +2,8 @@ import { Component, Input } from '@angular/core';
import { RemoteData } from '../../core/data/remote-data';
import { DSpaceObject } from '../../core/shared/dspace-object.model';
import { fadeIn, fadeInOut } from '../../shared/animations/fade';
import { SearchOptions } from '../search-options.model';
import { SearchOptions, ViewMode } from '../search-options.model';
import { SortOptions } from '../../core/cache/models/sort-options.model';
import { SearchResult } from '../search-result.model';
/**
@@ -21,4 +22,6 @@ import { SearchResult } from '../search-result.model';
export class SearchResultsComponent {
@Input() searchResults: RemoteData<Array<SearchResult<DSpaceObject>>>;
@Input() searchConfig: SearchOptions;
@Input() sortConfig: SortOptions;
@Input() viewMode: ViewMode;
}

View File

@@ -1,25 +1,24 @@
import { Injectable, OnDestroy } from '@angular/core';
import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { ViewMode } from '../../+search-page/search-options.model';
import { SortOptions } from '../../core/cache/models/sort-options.model';
import { ItemDataService } from '../../core/data/item-data.service';
import { PaginatedList } from '../../core/data/paginated-list';
import { RemoteData } from '../../core/data/remote-data';
import { Observable } from 'rxjs/Observable';
import { RemoteDataError } from '../../core/data/remote-data-error';
import { SearchResult } from '../search-result.model';
import { ItemDataService } from '../../core/data/item-data.service';
import { PageInfo } from '../../core/shared/page-info.model';
import { DSpaceObject } from '../../core/shared/dspace-object.model';
import { SearchOptions } from '../search-options.model';
import { hasValue, isNotEmpty } from '../../shared/empty.util';
import { Metadatum } from '../../core/shared/metadatum.model';
import { Item } from '../../core/shared/item.model';
import { ItemSearchResult } from '../../object-list/search-result-list-element/item-search-result/item-search-result.model';
import { SearchFilterConfig } from './search-filter-config.model';
import { FilterType } from './filter-type.model';
import { FacetValue } from './facet-value.model';
import { ViewMode } from '../../+search-page/search-options.model';
import { Router, NavigationExtras, ActivatedRoute } from '@angular/router';
import { RouteService } from '../../shared/route.service';
import { Metadatum } from '../../core/shared/metadatum.model';
import { PageInfo } from '../../core/shared/page-info.model';
import { hasValue, isNotEmpty } from '../../shared/empty.util';
import { ItemSearchResult } from '../../shared/object-collection/shared/item-search-result.model';
import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
import { SortOptions } from '../../core/cache/models/sort-options.model';
import { RouteService } from '../../shared/route.service';
import { SearchOptions } from '../search-options.model';
import { SearchResult } from '../search-result.model';
import { FacetValue } from './facet-value.model';
import { FilterType } from './filter-type.model';
import { SearchFilterConfig } from './search-filter-config.model';
function shuffle(array: any[]) {
let i = 0;
@@ -102,6 +101,24 @@ export class SearchService implements OnDestroy {
}
search(query: string, scopeId?: string, searchOptions?: SearchOptions): Observable<RemoteData<Array<SearchResult<DSpaceObject>>>> {
this.searchOptions = searchOptions;
let self = `https://dspace7.4science.it/dspace-spring-rest/api/search?query=${query}`;
if (hasValue(scopeId)) {
self += `&scope=${scopeId}`;
}
if (isNotEmpty(searchOptions) && hasValue(searchOptions.pagination.currentPage)) {
self += `&page=${searchOptions.pagination.currentPage}`;
}
if (isNotEmpty(searchOptions) && hasValue(searchOptions.pagination.pageSize)) {
self += `&pageSize=${searchOptions.pagination.pageSize}`;
}
if (isNotEmpty(searchOptions) && hasValue(searchOptions.sort.direction)) {
self += `&sortDirection=${searchOptions.sort.direction}`;
}
if (isNotEmpty(searchOptions) && hasValue(searchOptions.sort.field)) {
self += `&sortField=${searchOptions.sort.field}`;
}
const error = undefined;
const returningPageInfo = new PageInfo();

View File

@@ -14,7 +14,7 @@
<h5>{{ 'search.sidebar.settings.rpp' | translate}}</h5>
<select class="form-control" (change)="reloadRPP($event)">
<option *ngFor="let item of searchOptions.pagination.pageSizeOptions" [value]="item"
<option *ngFor="let item of pageSizeOptions" [value]="item"
[selected]="item === searchOptions.pagination.pageSize ? 'selected': null">
{{item}}
</option>

View File

@@ -1,6 +1,6 @@
import { Component, Input, OnInit } from '@angular/core';
import { SearchService } from '../search-service/search.service';
import { SearchOptions } from '../search-options.model';
import { SearchOptions, ViewMode } from '../search-options.model';
import { SortDirection } from '../../core/cache/models/sort-options.model';
import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
@@ -20,6 +20,9 @@ export class SearchSettingsComponent implements OnInit {
* Number of items per page.
*/
public pageSize;
@Input() public pageSizeOptions;
public listPageSizeOptions: number[] = [5, 10, 20, 40, 60, 80, 100];
public gridPageSizeOptions: number[] = [12, 24, 36, 48 , 50, 62, 74, 84];
private sub;
private scope: string;
@@ -36,6 +39,7 @@ export class SearchSettingsComponent implements OnInit {
ngOnInit(): void {
this.searchOptions = this.service.searchOptions;
this.pageSize = this.searchOptions.pagination.pageSize;
this.pageSizeOptions = this.searchOptions.pagination.pageSizeOptions;
this.sub = this.route
.queryParams
.subscribe((params) => {
@@ -45,6 +49,11 @@ export class SearchSettingsComponent implements OnInit {
this.page = +params.page || this.searchOptions.pagination.currentPage;
this.pageSize = +params.pageSize || this.searchOptions.pagination.pageSize;
this.direction = +params.sortDirection || this.searchOptions.sort.direction;
if (params.view === ViewMode.Grid) {
this.pageSizeOptions = this.gridPageSizeOptions;
} else {
this.pageSizeOptions = this.listPageSizeOptions;
}
});
}

View File

@@ -2,6 +2,7 @@ import { BrowseResponseParsingService } from './browse-response-parsing.service'
import { BrowseEndpointRequest } from './request.models';
import { BrowseSuccessResponse, ErrorResponse } from '../cache/response-cache.models';
import { BrowseDefinition } from '../shared/browse-definition.model';
import { DSpaceRESTV2Response } from '../dspace-rest-v2/dspace-rest-v2-response.model';
describe('BrowseResponseParsingService', () => {
let service: BrowseResponseParsingService;
@@ -48,7 +49,7 @@ describe('BrowseResponseParsingService', () => {
_links: { self: { href: 'https://rest.api/discover/browses' } },
page: { size: 20, totalElements: 2, totalPages: 1, number: 0 }
}, statusCode: '200'
};
} as DSpaceRESTV2Response;
const invalidResponse1 = {
payload: {
@@ -71,22 +72,21 @@ describe('BrowseResponseParsingService', () => {
_links: { self: { href: 'https://rest.api/discover/browses' } },
page: { size: 20, totalElements: 2, totalPages: 1, number: 0 }
}, statusCode: '200'
};
} as DSpaceRESTV2Response;
const invalidResponse2 = {
payload: {
browses: [{}, {}],
_links: { self: { href: 'https://rest.api/discover/browses' } },
page: { size: 20, totalElements: 2, totalPages: 1, number: 0 }
}, statusCode: '200'
};
} as DSpaceRESTV2Response ;
const invalidResponse3 = {
payload: {
_links: { self: { href: 'https://rest.api/discover/browses' } },
page: { size: 20, totalElements: 2, totalPages: 1, number: 0 }
}, statusCode: '500'
};
} as DSpaceRESTV2Response;
const definitions = [
Object.assign(new BrowseDefinition(), {

View File

@@ -3,7 +3,7 @@ import { isEmpty, isNotEmpty } from '../../shared/empty.util';
import { CacheableObject } from '../cache/object-cache.reducer';
import { RemoteData } from '../data/remote-data';
import { ResourceType } from './resource-type';
import { ListableObject } from '../../object-list/listable-object/listable-object.model';
import { ListableObject } from '../../shared/object-collection/shared/listable-object.model';
import { Observable } from 'rxjs/Observable';
/**

View File

@@ -1 +0,0 @@
@import '../../../styles/variables.scss';

View File

@@ -1,14 +0,0 @@
import { Component, Inject } from '@angular/core';
import { Collection } from '../../core/shared/collection.model';
import { ObjectListElementComponent } from '../object-list-element/object-list-element.component';
import { listElementFor } from '../list-element-decorator';
@Component({
selector: 'ds-collection-list-element',
styleUrls: ['./collection-list-element.component.scss'],
templateUrl: './collection-list-element.component.html'
})
@listElementFor(Collection)
export class CollectionListElementComponent extends ObjectListElementComponent<Collection> {}

View File

@@ -1 +0,0 @@
@import '../../../styles/variables.scss';

View File

@@ -1,14 +0,0 @@
import { Component, Input, Inject } from '@angular/core';
import { Community } from '../../core/shared/community.model';
import { ObjectListElementComponent } from '../object-list-element/object-list-element.component';
import { listElementFor } from '../list-element-decorator';
@Component({
selector: 'ds-community-list-element',
styleUrls: ['./community-list-element.component.scss'],
templateUrl: './community-list-element.component.html'
})
@listElementFor(Community)
export class CommunityListElementComponent extends ObjectListElementComponent<Community> {}

View File

@@ -1 +0,0 @@
@import '../../../styles/variables.scss';

View File

@@ -1,14 +0,0 @@
import { Component, Input, Inject } from '@angular/core';
import { Item } from '../../core/shared/item.model';
import { ObjectListElementComponent } from '../object-list-element/object-list-element.component';
import { listElementFor } from '../list-element-decorator';
@Component({
selector: 'ds-item-list-element',
styleUrls: ['./item-list-element.component.scss'],
templateUrl: './item-list-element.component.html'
})
@listElementFor(Item)
export class ItemListElementComponent extends ObjectListElementComponent<Item> {}

View File

@@ -1,16 +0,0 @@
import { ListableObject } from './listable-object/listable-object.model';
import { GenericConstructor } from '../core/shared/generic-constructor';
const listElementMap = new Map();
export function listElementFor(listable: GenericConstructor<ListableObject>) {
return function decorator(objectElement: any) {
if (!objectElement) {
return;
}
listElementMap.set(listable, objectElement);
};
}
export function getListElementFor(listable: GenericConstructor<ListableObject>) {
return listElementMap.get(listable);
}

View File

@@ -1,6 +0,0 @@
@import '../../../styles/variables.scss';
:host {
display: block;
margin-bottom: $spacer;
}

View File

@@ -1,14 +0,0 @@
import { Component, Inject } from '@angular/core';
import { ListableObject } from '../listable-object/listable-object.model';
@Component({
selector: 'ds-object-list-element',
styleUrls: ['./object-list-element.component.scss'],
templateUrl: './object-list-element.component.html'
})
export class ObjectListElementComponent <T extends ListableObject> {
object: T;
public constructor(@Inject('objectElementProvider') public listable: ListableObject) {
this.object = listable as T;
}
}

View File

@@ -1 +0,0 @@
@import '../../styles/variables.scss';

View File

@@ -1,5 +0,0 @@
import { SearchResult } from '../../../+search-page/search-result.model';
import { Collection } from '../../../core/shared/collection.model';
export class CollectionSearchResult extends SearchResult<Collection> {
}

View File

@@ -1,5 +0,0 @@
import { SearchResult } from '../../../+search-page/search-result.model';
import { Community } from '../../../core/shared/community.model';
export class CommunitySearchResult extends SearchResult<Community> {
}

View File

@@ -1,2 +0,0 @@
@import '../../../styles/variables.scss';

View File

@@ -0,0 +1,15 @@
<ds-object-list [config]="config"
[sortConfig]="sortConfig"
[objects]="objects"
[hideGear]="hideGear"
*ngIf="getViewMode()===viewModeEnum.List">
</ds-object-list>
<ds-object-grid [config]="config"
[sortConfig]="sortConfig"
[objects]="objects"
[hideGear]="true"
*ngIf="getViewMode()===viewModeEnum.Grid">
</ds-object-grid>

View File

@@ -0,0 +1 @@
@import '../../../styles/variables';

View File

@@ -0,0 +1,54 @@
import { ObjectCollectionComponent } from './object-collection.component';
import { ViewMode } from '../../+search-page/search-options.model';
import { element } from 'protractor';
import { By } from '@angular/platform-browser';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Config } from '../../../config/config.interface';
import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { RouterStub } from '../testing/router-stub';
describe('ObjectCollectionComponent', () => {
let fixture: ComponentFixture<ObjectCollectionComponent>;
let objectCollectionComponent: ObjectCollectionComponent;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ObjectCollectionComponent ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub }
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(ObjectCollectionComponent);
objectCollectionComponent = fixture.componentInstance;
}));
it('should only show the grid component when the viewmode is set to grid', () => {
objectCollectionComponent.currentMode = ViewMode.Grid;
expect(fixture.debugElement.query(By.css('ds-object-grid'))).toBeDefined();
expect(fixture.debugElement.query(By.css('ds-object-list'))).toBeNull();
});
it('should only show the list component when the viewmode is set to list', () => {
objectCollectionComponent.currentMode = ViewMode.List;
expect(fixture.debugElement.query(By.css('ds-object-list'))).toBeDefined();
expect(fixture.debugElement.query(By.css('ds-object-grid'))).toBeNull();
})
});

View File

@@ -0,0 +1,119 @@
import { Component, EventEmitter,
Input,
OnInit,
Output, SimpleChanges, OnChanges, ChangeDetectorRef } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { RemoteData } from '../../core/data/remote-data';
import { PageInfo } from '../../core/shared/page-info.model';
import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
import { ListableObject } from './shared/listable-object.model';
import { ViewMode } from '../../+search-page/search-options.model';
import { hasValue, isNotEmpty } from '../empty.util';
@Component({
selector: 'ds-viewable-collection',
styleUrls: ['./object-collection.component.scss'],
templateUrl: './object-collection.component.html',
})
export class ObjectCollectionComponent implements OnChanges, OnInit {
@Input() objects: RemoteData<ListableObject[]>;
@Input() config?: PaginationComponentOptions;
@Input() sortConfig: SortOptions;
@Input() hideGear = false;
pageInfo: Observable<PageInfo>;
private sub;
/**
* An event fired when the page is changed.
* Event's payload equals to the newly selected page.
*/
@Output() pageChange: EventEmitter<number> = new EventEmitter<number>();
/**
* An event fired when the page wsize is changed.
* Event's payload equals to the newly selected page size.
*/
@Output() pageSizeChange: EventEmitter<number> = new EventEmitter<number>();
/**
* An event fired when the sort direction is changed.
* Event's payload equals to the newly selected sort direction.
*/
@Output() sortDirectionChange: EventEmitter<SortDirection> = new EventEmitter<SortDirection>();
@Output() paginationChange: EventEmitter<SortDirection> = new EventEmitter<any>();
/**
* An event fired when the sort field is changed.
* Event's payload equals to the newly selected sort field.
*/
@Output() sortFieldChange: EventEmitter<string> = new EventEmitter<string>();
data: any = {};
currentMode: ViewMode = ViewMode.List;
viewModeEnum = ViewMode;
ngOnChanges(changes: SimpleChanges) {
if (changes.objects && !changes.objects.isFirstChange()) {
// this.pageInfo = this.objects.pageInfo;
}
}
ngOnInit(): void {
// this.pageInfo = this.objects.pageInfo;
this.sub = this.route
.queryParams
.subscribe((params) => {
if (isNotEmpty(params.view)) {
this.currentMode = params.view;
}
});
}
/**
* @param route
* Route is a singleton service provided by Angular.
* @param router
* Router is a singleton service provided by Angular.
*/
constructor(private cdRef: ChangeDetectorRef, private route: ActivatedRoute,
private router: Router) {
}
getViewMode(): ViewMode {
this.route.queryParams.map((params) => {
if (isNotEmpty(params.view) && hasValue(params.view)) {
this.currentMode = params.view;
}
});
return this.currentMode;
}
onPageChange(event) {
this.pageChange.emit(event);
}
onPageSizeChange(event) {
this.pageSizeChange.emit(event);
}
onSortDirectionChange(event) {
this.sortDirectionChange.emit(event);
}
onSortFieldChange(event) {
this.sortFieldChange.emit(event);
}
onPaginationChange(event) {
this.paginationChange.emit(event);
}
}

View File

@@ -0,0 +1,16 @@
import { ViewMode } from '../../../+search-page/search-options.model';
import { renderElementsFor } from './dso-element-decorator';
import { Item } from '../../../core/shared/item.model';
describe('ElementDecorator', () => {
const gridDecorator = renderElementsFor(Item, ViewMode.Grid);
const listDecorator = renderElementsFor(Item, ViewMode.List);
it('should have a decorator for both list and grid', () => {
expect(listDecorator.length).not.toBeNull();
expect(gridDecorator.length).not.toBeNull();
});
it('should have 2 separate decorators for grid and list', () => {
expect(listDecorator).not.toEqual(gridDecorator);
});
});

View File

@@ -0,0 +1,20 @@
import { GenericConstructor } from '../../../core/shared/generic-constructor';
import { ListableObject } from './listable-object.model';
import { ViewMode } from '../../../+search-page/search-options.model';
const dsoElementMap = new Map();
export function renderElementsFor(listable: GenericConstructor<ListableObject>, viewMode: ViewMode) {
return function decorator(objectElement: any) {
if (!objectElement) {
return;
}
if (!dsoElementMap.get(viewMode)) {
dsoElementMap.set(viewMode, new Map());
}
dsoElementMap.get(viewMode).set(listable, objectElement);
};
}
export function rendersDSOType(listable: GenericConstructor<ListableObject>, viewMode: ViewMode) {
return dsoElementMap.get(viewMode).get(listable);
}

View File

@@ -0,0 +1,13 @@
import { Component, Inject } from '@angular/core';
import { ListableObject } from '../listable-object.model';
@Component({
selector: 'ds-abstract-object-element',
template: ``,
})
export class AbstractListableElementComponent <T extends ListableObject> {
object: T;
public constructor(@Inject('objectElementProvider') public listableObject: ListableObject) {
this.object = listableObject as T;
}
}

View File

@@ -0,0 +1,14 @@
<div class="card">
<a [routerLink]="['/collections/' + object.id]"class="card-img-top">
<ds-comcol-page-logo [logo]="object.logo">
</ds-comcol-page-logo>
</a>
<div class="card-body">
<h4 class="card-title">{{object.name}}</h4>
<p *ngIf="object.shortDescription" class="card-text">{{object.shortDescription}}</p>
<div class="text-center">
<a [routerLink]="['/collections/' + object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,2 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,59 @@
import { CollectionGridElementComponent } from './collection-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { Collection } from '../../../core/shared/collection.model';
let fixture: ComponentFixture<CollectionGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
const mockCollection: Collection = Object.assign(new Collection(), {
metadata: [
{
key: 'dc.description.abstract',
language: 'en_US',
value: 'Short description'
}]
});
const createdGridElementComponent:CollectionGridElementComponent= new CollectionGridElementComponent(mockCollection);
describe('CollectionGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CollectionGridElementComponent ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: (createdGridElementComponent)}
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(CollectionGridElementComponent);
}));
it('should show the collection cards in the grid element',() => {
expect(fixture.debugElement.query(By.css('ds-collection-grid-element'))).toBeDefined();
});
it('should only show the description if "short description" metadata is present',() => {
const descriptionText = expect(fixture.debugElement.query(By.css('p.card-text')));
if (mockCollection.shortDescription.length > 0) {
expect(descriptionText).toBeDefined();
}else {
expect(descriptionText).not.toBeDefined();
}
});
})

View File

@@ -0,0 +1,15 @@
import { Component, Inject } from '@angular/core';
import { Collection } from '../../../core/shared/collection.model';
import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
import { ViewMode } from '../../../+search-page/search-options.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
@Component({
selector: 'ds-collection-grid-element',
styleUrls: ['./collection-grid-element.component.scss'],
templateUrl: './collection-grid-element.component.html'
})
@renderElementsFor(Collection, ViewMode.Grid)
export class CollectionGridElementComponent extends AbstractListableElementComponent<Collection> {}

View File

@@ -0,0 +1,14 @@
<div class="card">
<a [routerLink]="['/communities/' + object.id]"class="card-img-top">
<ds-comcol-page-logo [logo]="object.logo">
</ds-comcol-page-logo>
</a>
<div class="card-body">
<h4 class="card-title">{{object.name}}</h4>
<p *ngIf="object.shortDescription" class="card-text">{{object.shortDescription}}</p>
<div class="text-center">
<a [routerLink]="['/communities/' + object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,2 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,66 @@
import { CommunityGridElementComponent } from './community-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../testing/router-stub';
import { Observable } from 'rxjs/Observable';
import { By } from '@angular/platform-browser';
import { ListableObject } from '../../object-collection/shared/listable-object.model';
import { Community } from '../../../core/shared/community.model';
let communityGridElementComponent: CommunityGridElementComponent;
let fixture: ComponentFixture<CommunityGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
const mockCommunity: Community = Object.assign(new Community(), {
metadata: [
{
key: 'dc.description.abstract',
language: 'en_US',
value: 'Short description'
}]
});
const createdGridElementComponent:CommunityGridElementComponent= new CommunityGridElementComponent(mockCommunity);
describe('CommunityGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CommunityGridElementComponent ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: (createdGridElementComponent)}
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(CommunityGridElementComponent);
communityGridElementComponent = fixture.componentInstance;
}));
it('should show the community cards in the grid element',() => {
expect(fixture.debugElement.query(By.css('ds-community-grid-element'))).toBeDefined();
})
it('should only show the description if "short description" metadata is present',() => {
const descriptionText = expect(fixture.debugElement.query(By.css('p.card-text')));
if (mockCommunity.shortDescription.length > 0) {
expect(descriptionText).toBeDefined();
}else {
expect(descriptionText).not.toBeDefined();
}
});
});

View File

@@ -0,0 +1,15 @@
import { Component, Input, Inject } from '@angular/core';
import { Community } from '../../../core/shared/community.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
import { ViewMode } from '../../../+search-page/search-options.model';
@Component({
selector: 'ds-community-grid-element',
styleUrls: ['./community-grid-element.component.scss'],
templateUrl: './community-grid-element.component.html'
})
@renderElementsFor(Community, ViewMode.Grid)
export class CommunityGridElementComponent extends AbstractListableElementComponent<Community> {}

View File

@@ -0,0 +1,4 @@
<div class="thumbnail">
<img *ngIf="thumbnail && thumbnail.content" [src]="thumbnail.content" (error)="errorHandler($event)"/>
<img *ngIf="!(thumbnail && thumbnail.content)" [src]="holderSource | dsSafeUrl"/>
</div>

View File

@@ -0,0 +1 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,42 @@
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { GridThumbnailComponent } from './grid-thumbnail.component';
import { Bitstream } from '../../../core/shared/bitstream.model';
import { SafeUrlPipe } from '../../utils/safe-url-pipe';
describe('ThumbnailComponent', () => {
let comp: GridThumbnailComponent;
let fixture: ComponentFixture<GridThumbnailComponent>;
let de: DebugElement;
let el: HTMLElement;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [GridThumbnailComponent, SafeUrlPipe]
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(GridThumbnailComponent);
comp = fixture.componentInstance; // BannerComponent test instance
de = fixture.debugElement.query(By.css('div.thumbnail'));
el = de.nativeElement;
});
it('should display image', () => {
comp.thumbnail = new Bitstream();
comp.thumbnail.content = 'test.url';
fixture.detectChanges();
const image: HTMLElement = de.query(By.css('img')).nativeElement;
expect(image.getAttribute('src')).toBe(comp.thumbnail.content);
});
it('should display placeholder', () => {
fixture.detectChanges();
const image: HTMLElement = de.query(By.css('img')).nativeElement;
expect(image.getAttribute('src')).toBe(comp.holderSource);
});
});

View File

@@ -0,0 +1,30 @@
import { Component, Input } from '@angular/core';
import { Bitstream } from '../../../core/shared/bitstream.model';
/**
* This component renders a given Bitstream as a thumbnail.
* One input parameter of type Bitstream is expected.
* If no Bitstream is provided, a holderjs image will be rendered instead.
*/
@Component({
selector: 'ds-grid-thumbnail',
styleUrls: ['./grid-thumbnail.component.scss'],
templateUrl: './grid-thumbnail.component.html'
})
export class GridThumbnailComponent {
@Input() thumbnail: Bitstream;
data: any = {};
/**
* The default 'holder.js' image
*/
holderSource = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjYwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDI2MCAxODAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzEwMCV4MTgwL3RleHQ6Tm8gVGh1bWJuYWlsCkNyZWF0ZWQgd2l0aCBIb2xkZXIuanMgMi42LjAuCkxlYXJuIG1vcmUgYXQgaHR0cDovL2hvbGRlcmpzLmNvbQooYykgMjAxMi0yMDE1IEl2YW4gTWFsb3BpbnNreSAtIGh0dHA6Ly9pbXNreS5jbwotLT48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwhW0NEQVRBWyNob2xkZXJfMTVmNzJmMmFlMGIgdGV4dCB7IGZpbGw6I0FBQUFBQTtmb250LXdlaWdodDpib2xkO2ZvbnQtZmFtaWx5OkFyaWFsLCBIZWx2ZXRpY2EsIE9wZW4gU2Fucywgc2Fucy1zZXJpZiwgbW9ub3NwYWNlO2ZvbnQtc2l6ZToxM3B0IH0gXV0+PC9zdHlsZT48L2RlZnM+PGcgaWQ9ImhvbGRlcl8xNWY3MmYyYWUwYiI+PHJlY3Qgd2lkdGg9IjI2MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiNFRUVFRUUiLz48Zz48dGV4dCB4PSI3Mi4yNDIxODc1IiB5PSI5NiI+Tm8gVGh1bWJuYWlsPC90ZXh0PjwvZz48L2c+PC9zdmc+';
errorHandler(event) {
event.currentTarget.src = this.holderSource;
}
}

View File

@@ -0,0 +1,23 @@
<div class="card">
<a [routerLink]="['/items/' + object.id]" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="object.getThumbnail()">
</ds-grid-thumbnail>
</a>
<div class="card-body">
<h4 class="card-title">{{object.findMetadata('dc.title')}}</h4>
<p *ngIf="object.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']);" class="item-authors card-text text-muted">
<span *ngFor="let authorMd of object.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']); let last=last;">{{authorMd.value}}
<span *ngIf="!last">; </span>
</span>
<span *ngIf="object.findMetadata('dc.date.issued')">{{object.findMetadata("dc.date.issued")}}</span>
</p>
<p *ngIf="object.findMetadata('dc.description.abstract')" class="item-abstract card-text">{{object.findMetadata("dc.description.abstract") | dsTruncate:[200] }}</p>
<div class="text-center">
<a [routerLink]="['/items/' + object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,2 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,67 @@
import { ItemGridElementComponent } from './item-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { TruncatePipe } from '../../utils/truncate.pipe';
import { Item } from '../../../core/shared/item.model';
let itemGridElementComponent: ItemGridElementComponent;
let fixture: ComponentFixture<ItemGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
/* tslint:disable:no-shadowed-variable */
const mockItem: Item = Object.assign(new Item(), {
metadata: [
{
key: 'dc.contributor.author',
language: 'en_US',
value: 'Smith, Donald'
}]
});
const createdGridElementComponent:ItemGridElementComponent= new ItemGridElementComponent(mockItem);
describe('ItemGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ItemGridElementComponent , TruncatePipe],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: {createdGridElementComponent}}
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(ItemGridElementComponent);
itemGridElementComponent = fixture.componentInstance;
}));
it('should show the item cards in the grid element',() => {
expect(fixture.debugElement.query(By.css('ds-item-grid-element'))).toBeDefined()
});
it('should only show the author span if the author metadata is present',() => {
const itemAuthorField = expect(fixture.debugElement.query(By.css('p.item-authors')));
if (mockItem.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length > 0) {
expect(itemAuthorField).toBeDefined();
}else {
expect(itemAuthorField).toBeDefined();
}
});
})

View File

@@ -0,0 +1,15 @@
import { Component, Input, Inject } from '@angular/core';
import { Item } from '../../../core/shared/item.model';
import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { ViewMode } from '../../../+search-page/search-options.model';
@Component({
selector: 'ds-item-grid-element',
styleUrls: ['./item-grid-element.component.scss'],
templateUrl: './item-grid-element.component.html'
})
@renderElementsFor(Item, ViewMode.Grid)
export class ItemGridElementComponent extends AbstractListableElementComponent<Item> {}

View File

@@ -0,0 +1,21 @@
<ds-pagination
[paginationOptions]="config"
[pageInfoState]="objects?.payload"
[collectionSize]="objects?.payload?.totalElements"
[sortOptions]="sortConfig"
[hideGear]="hideGear"
[hidePagerWhenSinglePage]="hidePagerWhenSinglePage"
(pageChange)="onPageChange($event)"
(pageSizeChange)="onPageSizeChange($event)"
(sortDirectionChange)="onSortDirectionChange($event)"
(sortFieldChange)="onSortFieldChange($event)"
(paginationChange)="onPaginationChange($event)">
<div class="row mt-2" *ngIf="objects?.hasSucceeded" @fadeIn>
<div class="col-lg-4 col-sm-6 col-xs-12 "
*ngFor="let object of objects?.payload?.page">
<ds-wrapper-grid-element [object]="object"></ds-wrapper-grid-element>
</div>
</div>
<ds-error *ngIf="objects.hasFailed | async" message="{{'error.objects' | translate}}"></ds-error>
<ds-loading *ngIf="objects.isLoading | async" message="{{'loading.objects' | translate}}"></ds-loading>
</ds-pagination>

View File

@@ -0,0 +1,27 @@
@import '../../../styles/variables';
ds-wrapper-grid-element ::ng-deep {
div.thumbnail > img {
height: $card-thumbnail-height;
width: 100%;
}
.card-title {
line-height: $headings-line-height;
height: ($headings-line-height*3) +em;
overflow: hidden;
text-overflow: ellipsis;
}
.item-abstract {
line-height: $line-height-base;
height: ($line-height-base*5)+em;
overflow: hidden;
text-overflow: ellipsis;
}
.item-authors{
line-height: $line-height-base;
height: ($line-height-base*1.5)+em;
}
div.card {
margin-bottom: 20px;
}
}

View File

@@ -0,0 +1,100 @@
import {
ChangeDetectionStrategy,
Component,
EventEmitter,
Input,
Output,
ViewEncapsulation
} from '@angular/core';
import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
import { PaginatedList } from '../../core/data/paginated-list';
import { RemoteData } from '../../core/data/remote-data';
import { fadeIn } from '../animations/fade';
import { ListableObject } from '../object-collection/shared/listable-object.model';
import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
@Component({
changeDetection: ChangeDetectionStrategy.Default,
encapsulation: ViewEncapsulation.Emulated,
selector: 'ds-object-grid',
styleUrls: [ './object-grid.component.scss' ],
templateUrl: './object-grid.component.html',
animations: [fadeIn]
})
export class ObjectGridComponent {
@Input() config: PaginationComponentOptions;
@Input() sortConfig: SortOptions;
@Input() hideGear = false;
@Input() hidePagerWhenSinglePage = true;
private _objects: RemoteData<PaginatedList<ListableObject>>;
@Input() set objects(objects: RemoteData<PaginatedList<ListableObject>>) {
this._objects = objects;
}
get objects() {
return this._objects;
}
/**
* An event fired when the page is changed.
* Event's payload equals to the newly selected page.
*/
@Output() change: EventEmitter<{
pagination: PaginationComponentOptions,
sort: SortOptions
}> = new EventEmitter<{
pagination: PaginationComponentOptions,
sort: SortOptions
}>();
/**
* An event fired when the page is changed.
* Event's payload equals to the newly selected page.
*/
@Output() pageChange: EventEmitter<number> = new EventEmitter<number>();
/**
* An event fired when the page wsize is changed.
* Event's payload equals to the newly selected page size.
*/
@Output() pageSizeChange: EventEmitter<number> = new EventEmitter<number>();
/**
* An event fired when the sort direction is changed.
* Event's payload equals to the newly selected sort direction.
*/
@Output() sortDirectionChange: EventEmitter<SortDirection> = new EventEmitter<SortDirection>();
@Output() paginationChange: EventEmitter<SortDirection> = new EventEmitter<any>();
/**
* An event fired when the sort field is changed.
* Event's payload equals to the newly selected sort field.
*/
@Output() sortFieldChange: EventEmitter<string> = new EventEmitter<string>();
data: any = {};
onPageChange(event) {
this.pageChange.emit(event);
}
onPageSizeChange(event) {
this.pageSizeChange.emit(event);
}
onSortDirectionChange(event) {
this.sortDirectionChange.emit(event);
}
onSortFieldChange(event) {
this.sortFieldChange.emit(event);
}
onPaginationChange(event) {
this.paginationChange.emit(event);
}
}

View File

@@ -0,0 +1,13 @@
<div class="card">
<a [routerLink]="['/collections/' + dso.id]"class="card-img-top">
<ds-comcol-page-logo [logo]="dso.logo">
</ds-comcol-page-logo>
</a>
<div class="card-body">
<h4 class="card-title">{{dso.name}}</h4>
<p *ngIf="dso.shortDescription" class="card-text">{{dso.shortDescription}}</p>
<div class="text-center">
<a [routerLink]="['/collections/' + dso.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,64 @@
import {CollectionSearchResultGridElementComponent } from './collection-search-result-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { TruncatePipe } from '../../../utils/truncate.pipe';
import { Community } from '../../../../core/shared/community.model';
import { Collection } from '../../../../core/shared/collection.model';
let fixture: ComponentFixture<CollectionSearchResultGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
const mockCollection: Collection = Object.assign(new Collection(), {
metadata: [
{
key: 'dc.description.abstract',
language: 'en_US',
value: 'Short description'
} ]
});
const createdGridElementComponent: CollectionSearchResultGridElementComponent = new CollectionSearchResultGridElementComponent(mockCollection);
describe('CollectionSearchResultGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CollectionSearchResultGridElementComponent, TruncatePipe ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: (createdGridElementComponent) }
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(CollectionSearchResultGridElementComponent);
}));
it('should show the item result cards in the grid element', () => {
expect(fixture.debugElement.query(By.css('ds-collection-search-result-grid-element'))).toBeDefined();
});
it('should only show the description if "short description" metadata is present',() => {
const descriptionText = expect(fixture.debugElement.query(By.css('p.card-text')));
if (mockCollection.shortDescription.length > 0) {
expect(descriptionText).toBeDefined();
}else {
expect(descriptionText).not.toBeDefined();
}
});
});

View File

@@ -0,0 +1,17 @@
import { Component } from '@angular/core';
import { renderElementsFor} from '../../../object-collection/shared/dso-element-decorator';
import { CollectionSearchResult } from './collection-search-result.model';
import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
import { Collection } from '../../../../core/shared/collection.model';
import { ViewMode } from '../../../../+search-page/search-options.model';
@Component({
selector: 'ds-collection-search-result-grid-element',
styleUrls: ['../search-result-grid-element.component.scss', 'collection-search-result-grid-element.component.scss'],
templateUrl: 'collection-search-result-grid-element.component.html'
})
@renderElementsFor(CollectionSearchResult, ViewMode.Grid)
export class CollectionSearchResultGridElementComponent extends SearchResultGridElementComponent<CollectionSearchResult, Collection> {}

View File

@@ -0,0 +1,5 @@
import { SearchResult } from '../../../../+search-page/search-result.model';
import { Collection } from '../../../../core/shared/collection.model';
export class CollectionSearchResult extends SearchResult<Collection> {
}

View File

@@ -0,0 +1,14 @@
<div class="card">
<a [routerLink]="['/communities/' + dso.id]"class="card-img-top">
<ds-comcol-page-logo [logo]="dso.logo">
</ds-comcol-page-logo>
</a>
<div class="card-body">
<h4 class="card-title">{{dso.name}}</h4>
<p *ngIf="dso.shortDescription" class="card-text">{{dso.shortDescription}}</p>
<div class="text-center">
<a [routerLink]="['/communities/' + dso.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,2 @@
@import '../../../../../styles/variables';

View File

@@ -0,0 +1,63 @@
import { CommunitySearchResultGridElementComponent } from './community-search-result-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { TruncatePipe } from '../../../utils/truncate.pipe';
import { Community } from '../../../../core/shared/community.model';
let fixture: ComponentFixture<CommunitySearchResultGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
const mockCommunity: Community = Object.assign(new Community(), {
metadata: [
{
key: 'dc.description.abstract',
language: 'en_US',
value: 'Short description'
} ]
});
const createdGridElementComponent: CommunitySearchResultGridElementComponent = new CommunitySearchResultGridElementComponent(mockCommunity);
describe('CommunitySearchResultGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CommunitySearchResultGridElementComponent, TruncatePipe ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: (createdGridElementComponent) }
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(CommunitySearchResultGridElementComponent);
}));
it('should show the item result cards in the grid element', () => {
expect(fixture.debugElement.query(By.css('ds-community-search-result-grid-element'))).toBeDefined();
});
it('should only show the description if "short description" metadata is present',() => {
const descriptionText = expect(fixture.debugElement.query(By.css('p.card-text')));
if (mockCommunity.shortDescription.length > 0) {
expect(descriptionText).toBeDefined();
}else {
expect(descriptionText).not.toBeDefined();
}
});
});

View File

@@ -0,0 +1,18 @@
import { Component } from '@angular/core';
import { CommunitySearchResult } from './community-search-result.model';
import { Community } from '../../../../core/shared/community.model';
import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
import { ViewMode } from '../../../../+search-page/search-options.model';
@Component({
selector: 'ds-community-search-result-grid-element',
styleUrls: ['../search-result-grid-element.component.scss', 'community-search-result-grid-element.component.scss'],
templateUrl: 'community-search-result-grid-element.component.html'
})
@renderElementsFor(CommunitySearchResult, ViewMode.Grid)
export class CommunitySearchResultGridElementComponent extends SearchResultGridElementComponent<CommunitySearchResult, Community> {
}

View File

@@ -0,0 +1,5 @@
import { SearchResult } from '../../../../+search-page/search-result.model';
import { Community } from '../../../../core/shared/community.model';
export class CommunitySearchResult extends SearchResult<Community> {
}

View File

@@ -0,0 +1,34 @@
<div class="card">
<a [routerLink]="['/items/' + dso.id]" class="card-img-top full-width">
<ds-grid-thumbnail [thumbnail]="dso.getThumbnail()">
</ds-grid-thumbnail>
</a>
<div class="card-body">
<h4 class="card-title" [innerHTML]="dso.findMetadata('dc.title')"></h4>
<p *ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*'])"
class="item-authors card-text text-muted">
<span
*ngFor="let authorMd of dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']); let first=first;">
<span *ngIf="first" [innerHTML]="authorMd.value">
<span
*ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length>1">, ...</span>
</span>
</span>
<span *ngIf="dso.findMetadata('dc.date.issued')"
class="item-list-date">
<span *ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length>1">,</span>
{{dso.findMetadata("dc.date.issued")}}</span>
</p>
<p class="item-abstract card-text" [innerHTML]="getFirstValue('dc.description.abstract') | dsTruncate:[200]">
</p>
<div class="text-center">
<a [routerLink]="['/items/' + dso.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

View File

@@ -0,0 +1,2 @@
@import '../../../../../styles/variables';

View File

@@ -0,0 +1,80 @@
import { ItemSearchResultGridElementComponent } from './item-search-result-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { TruncatePipe } from '../../../utils/truncate.pipe';
import { Item } from '../../../../core/shared/item.model';
let itemSearchResultGridElementComponent: ItemSearchResultGridElementComponent;
let fixture: ComponentFixture<ItemSearchResultGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
const mockItem: Item = Object.assign(new Item(), {
metadata: [
{
key: 'dc.contributor.author',
language: 'en_US',
value: 'Smith, Donald'
},
{
key: 'dc.date.issued',
language: null,
value: '1650-06-26'
}]
});
const createdGridElementComponent:ItemSearchResultGridElementComponent= new ItemSearchResultGridElementComponent(mockItem);
describe('ItemSearchResultGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ItemSearchResultGridElementComponent, TruncatePipe ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useValue: (createdGridElementComponent) }
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(ItemSearchResultGridElementComponent);
itemSearchResultGridElementComponent = fixture.componentInstance;
}));
it('should show the item result cards in the grid element',() => {
expect(fixture.debugElement.query(By.css('ds-item-search-result-grid-element'))).toBeDefined();
});
it('should only show the author span if the author metadata is present',() => {
const itemAuthorField = expect(fixture.debugElement.query(By.css('p.item-authors')));
if (mockItem.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length > 0) {
expect(itemAuthorField).toBeDefined();
}else {
expect(itemAuthorField).not.toBeDefined();
}
});
it('should only show the date span if the issuedate is present',() => {
const dateField = expect(fixture.debugElement.query(By.css('span.item-list-date')));
if (mockItem.findMetadata('dc.date.issued').length > 0) {
expect(dateField).toBeDefined();
}else {
expect(dateField).not.toBeDefined();
}
});
});

View File

@@ -0,0 +1,16 @@
import { Component } from '@angular/core';
import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
import { Item } from '../../../../core/shared/item.model';
import { ItemSearchResult } from '../../../object-collection/shared/item-search-result.model';
import { ViewMode } from '../../../../+search-page/search-options.model';
@Component({
selector: 'ds-item-search-result-grid-element',
styleUrls: ['../search-result-grid-element.component.scss', 'item-search-result-grid-element.component.scss'],
templateUrl: 'item-search-result-grid-element.component.html'
})
@renderElementsFor(ItemSearchResult, ViewMode.Grid)
export class ItemSearchResultGridElementComponent extends SearchResultGridElementComponent<ItemSearchResult, Item> {}

View File

@@ -0,0 +1,7 @@
@import '../../../../styles/variables';
:host {
/deep/ em {
font-weight: bold;
font-style: normal;
}
}

View File

@@ -0,0 +1,57 @@
import { Component, Inject } from '@angular/core';
import { SearchResult } from '../../../+search-page/search-result.model';
import { DSpaceObject } from '../../../core/shared/dspace-object.model';
import { Metadatum } from '../../../core/shared/metadatum.model';
import { isEmpty, hasNoValue } from '../../empty.util';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { ListableObject } from '../../object-collection/shared/listable-object.model';
@Component({
selector: 'ds-search-result-grid-element',
template: ``
})
export class SearchResultGridElementComponent<T extends SearchResult<K>, K extends DSpaceObject> extends AbstractListableElementComponent<T> {
dso: K;
public constructor(@Inject('objectElementProvider') public gridable: ListableObject) {
super(gridable);
this.dso = this.object.dspaceObject;
}
getValues(keys: string[]): string[] {
const results: string[] = new Array<string>();
this.object.hitHighlights.forEach(
(md: Metadatum) => {
if (keys.indexOf(md.key) > -1) {
results.push(md.value);
}
}
);
if (isEmpty(results)) {
this.dso.filterMetadata(keys).forEach(
(md: Metadatum) => {
results.push(md.value);
}
);
}
return results;
}
getFirstValue(key: string): string {
let result: string;
this.object.hitHighlights.some(
(md: Metadatum) => {
if (key === md.key) {
result = md.value;
return true;
}
}
);
if (hasNoValue(result)) {
result = this.dso.findMetadata(key);
}
return result;
}
}

View File

@@ -0,0 +1 @@
<ng-container *ngComponentOutlet="getGridElement(); injector: objectInjector;"></ng-container>

View File

@@ -0,0 +1,2 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,43 @@
import { WrapperGridElementComponent } from './wrapper-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router';
import { RouterStub } from '../../testing/router-stub';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
let wrapperGridElementComponent: WrapperGridElementComponent;
let fixture: ComponentFixture<WrapperGridElementComponent>;
const queryParam = 'test query';
const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
const activatedRouteStub = {
queryParams: Observable.of({
query: queryParam,
scope: scopeParam
})
};
describe('WrapperGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ WrapperGridElementComponent ],
providers: [
{ provide: ActivatedRoute, useValue: activatedRouteStub },
{ provide: Router, useClass: RouterStub },
{ provide: 'objectElementProvider', useFactory: (wrapperGridElementComponent)}
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents(); // compile template and css
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(WrapperGridElementComponent);
wrapperGridElementComponent = fixture.componentInstance;
}));
it('should show the wrapper element containing the cards',() => {
expect(fixture.debugElement.query(By.css('ds-collection-grid-element'))).toBeDefined();
})
})

View File

@@ -0,0 +1,28 @@
import { Component, Input, Injector, ReflectiveInjector, OnInit } from '@angular/core';
import { GenericConstructor } from '../../../core/shared/generic-constructor';
import { rendersDSOType } from '../../object-collection/shared/dso-element-decorator';
import { ListableObject } from '../../object-collection/shared/listable-object.model';
import { ViewMode } from '../../../+search-page/search-options.model';
@Component({
selector: 'ds-wrapper-grid-element',
styleUrls: ['./wrapper-grid-element.component.scss'],
templateUrl: './wrapper-grid-element.component.html'
})
export class WrapperGridElementComponent implements OnInit {
@Input() object: ListableObject;
objectInjector: Injector;
constructor(private injector: Injector) {}
ngOnInit(): void {
this.objectInjector = ReflectiveInjector.resolveAndCreate(
[{provide: 'objectElementProvider', useFactory: () => (this.object) }], this.injector);
}
getGridElement(): string {
const f: GenericConstructor<ListableObject> = this.object.constructor as GenericConstructor<ListableObject>;
return rendersDSOType(f, ViewMode.Grid);
}
}

View File

@@ -0,0 +1 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,15 @@
import { Component, Inject } from '@angular/core';
import { Collection } from '../../../core/shared/collection.model';
import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
import { ViewMode } from '../../../+search-page/search-options.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
@Component({
selector: 'ds-collection-list-element',
styleUrls: ['./collection-list-element.component.scss'],
templateUrl: './collection-list-element.component.html'
})
@renderElementsFor(Collection, ViewMode.List)
export class CollectionListElementComponent extends AbstractListableElementComponent<Collection> {}

View File

@@ -0,0 +1 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,15 @@
import { Component, Input, Inject } from '@angular/core';
import { Community } from '../../../core/shared/community.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
import { ViewMode } from '../../../+search-page/search-options.model';
@Component({
selector: 'ds-community-list-element',
styleUrls: ['./community-list-element.component.scss'],
templateUrl: './community-list-element.component.html'
})
@renderElementsFor(Community, ViewMode.List)
export class CommunityListElementComponent extends AbstractListableElementComponent<Community> {}

View File

@@ -0,0 +1 @@
@import '../../../../styles/variables';

View File

@@ -0,0 +1,15 @@
import { Component, Input, Inject } from '@angular/core';
import { Item } from '../../../core/shared/item.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
import { ViewMode } from '../../../+search-page/search-options.model';
@Component({
selector: 'ds-item-list-element',
styleUrls: ['./item-list-element.component.scss'],
templateUrl: './item-list-element.component.html'
})
@renderElementsFor(Item, ViewMode.List)
export class ItemListElementComponent extends AbstractListableElementComponent<Item> {}

View File

@@ -0,0 +1 @@
@import '../../../styles/variables';

View File

@@ -6,16 +6,12 @@ import {
Output,
ViewEncapsulation
} from '@angular/core';
import { SortDirection, SortOptions } from '../core/cache/models/sort-options.model';
import { PaginatedList } from '../core/data/paginated-list';
import { RemoteData } from '../core/data/remote-data';
import { ListableObject } from './listable-object/listable-object.model';
import { fadeIn } from '../shared/animations/fade';
import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
import { PaginatedList } from '../../core/data/paginated-list';
import { RemoteData } from '../../core/data/remote-data';
import { fadeIn } from '../animations/fade';
import { ListableObject } from '../object-collection/shared/listable-object.model';
import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
@Component({
changeDetection: ChangeDetectionStrategy.Default,
@@ -35,6 +31,7 @@ export class ObjectListComponent {
@Input() set objects(objects: RemoteData<PaginatedList<ListableObject>>) {
this._objects = objects;
}
get objects() {
return this._objects;
}

View File

@@ -1,9 +1,10 @@
import { Component } from '@angular/core';
import { listElementFor } from '../../list-element-decorator';
import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
import { CollectionSearchResult } from './collection-search-result.model';
import { SearchResultListElementComponent } from '../search-result-list-element.component';
import { Collection } from '../../../core/shared/collection.model';
import { Collection } from '../../../../core/shared/collection.model';
import { ViewMode } from '../../../../+search-page/search-options.model';
@Component({
selector: 'ds-collection-search-result-list-element',
@@ -11,5 +12,5 @@ import { Collection } from '../../../core/shared/collection.model';
templateUrl: 'collection-search-result-list-element.component.html'
})
@listElementFor(CollectionSearchResult)
@renderElementsFor(CollectionSearchResult, ViewMode.List)
export class CollectionSearchResultListElementComponent extends SearchResultListElementComponent<CollectionSearchResult, Collection> {}

View File

@@ -0,0 +1,5 @@
import { SearchResult } from '../../../../+search-page/search-result.model';
import { Collection } from '../../../../core/shared/collection.model';
export class CollectionSearchResult extends SearchResult<Collection> {
}

View File

@@ -1,9 +1,10 @@
import { Component } from '@angular/core';
import { listElementFor } from '../../list-element-decorator';
import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
import { CommunitySearchResult } from './community-search-result.model';
import { SearchResultListElementComponent } from '../search-result-list-element.component';
import { Community } from '../../../core/shared/community.model';
import { Community } from '../../../../core/shared/community.model';
import { ViewMode } from '../../../../+search-page/search-options.model';
@Component({
selector: 'ds-community-search-result-list-element',
@@ -11,7 +12,7 @@ import { Community } from '../../../core/shared/community.model';
templateUrl: 'community-search-result-list-element.component.html'
})
@listElementFor(CommunitySearchResult)
@renderElementsFor(CommunitySearchResult, ViewMode.List)
export class CommunitySearchResultListElementComponent extends SearchResultListElementComponent<CommunitySearchResult, Community> {
}

View File

@@ -0,0 +1,5 @@
import { SearchResult } from '../../../../+search-page/search-result.model';
import { Community } from '../../../../core/shared/community.model';
export class CommunitySearchResult extends SearchResult<Community> {
}

Some files were not shown because too many files have changed in this diff Show More