hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-14 13:33:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'w2p-65195_dynamic-component-refactoring' into clean-relationships-in-submission

Browse Source
This commit is contained in:
lotte
2019-10-17 12:49:22 +02:00
parent 6d253be878 ddbe0c825a
commit f79e210959
573 changed files with 12000 additions and 3824 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.html
View File

@@ -1,14 +1,17 @@
<div class="card">
<a [routerLink]="['/collections/', object.id]" class="card-img-top">
<a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/collections/', object.id]" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="object.logo">
</ds-grid-thumbnail>
</a>
<span *ngIf="linkType == linkTypes.None" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="object.logo">
</ds-grid-thumbnail>
</span>
<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 *ngIf="linkType != linkTypes.None" class="text-center">
<a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/collections/', object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

9
src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
View File

@@ -1,15 +1,18 @@
import { Component, Inject } from '@angular/core';
import { Collection } from '../../../core/shared/collection.model';
import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
import { SetViewMode } from '../../view-mode';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { ViewMode } from '../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../object-collection/shared/listable-object/listable-object.decorator';
/**
* Component representing a grid element for collection
*/
@Component({
selector: 'ds-collection-grid-element',
styleUrls: ['./collection-grid-element.component.scss'],
templateUrl: './collection-grid-element.component.html'
})
@renderElementsFor(Collection, SetViewMode.Grid)
@listableObjectComponent(Collection, ViewMode.GridElement)
export class CollectionGridElementComponent extends AbstractListableElementComponent<Collection> {}

11
src/app/shared/object-grid/community-grid-element/community-grid-element.component.html
View File

@@ -1,14 +1,17 @@
<div class="card">
<a [routerLink]="['/communities/', object.id]" class="card-img-top">
<a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/communities/', object.id]" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="object.logo">
</ds-grid-thumbnail>
</a>
<span *ngIf="linkType == linkTypes.None" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="object.logo">
</ds-grid-thumbnail>
</span>
<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 *ngIf="linkType != linkTypes.None" class="text-center">
<a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/communities/', object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

11
src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
View File

@@ -1,15 +1,18 @@
import { Component, Input, Inject } from '@angular/core';
import { Component } 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 { SetViewMode } from '../../view-mode';
import { ViewMode } from '../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../object-collection/shared/listable-object/listable-object.decorator';
/**
* Component representing a grid element for a community
*/
@Component({
selector: 'ds-community-grid-element',
styleUrls: ['./community-grid-element.component.scss'],
templateUrl: './community-grid-element.component.html'
})
@renderElementsFor(Community, SetViewMode.Grid)
@listableObjectComponent(Community, ViewMode.GridElement)
export class CommunityGridElementComponent extends AbstractListableElementComponent<Community> {}

3
src/app/shared/object-grid/grid-thumbnail/grid-thumbnail.component.html
View File

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

4
src/app/shared/object-grid/grid-thumbnail/grid-thumbnail.component.spec.ts
View File

@@ -6,7 +6,7 @@ import { GridThumbnailComponent } from './grid-thumbnail.component';
import { Bitstream } from '../../../core/shared/bitstream.model';
import { SafeUrlPipe } from '../../utils/safe-url-pipe';
describe('ThumbnailComponent', () => {
describe('GridThumbnailComponent', () => {
let comp: GridThumbnailComponent;
let fixture: ComponentFixture<GridThumbnailComponent>;
let de: DebugElement;
@@ -36,7 +36,7 @@ describe('ThumbnailComponent', () => {
it('should display placeholder', () => {
fixture.detectChanges();
const image: HTMLElement = de.query(By.css('img')).nativeElement;
expect(image.getAttribute('src')).toBe(comp.holderSource);
expect(image.getAttribute('src')).toBe(comp.defaultImage);
});
});

18
src/app/shared/object-grid/grid-thumbnail/grid-thumbnail.component.ts
View File

@@ -1,5 +1,6 @@
import { Component, Input } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import { Bitstream } from '../../../core/shared/bitstream.model';
import { hasValue } from '../../empty.util';
/**
* This component renders a given Bitstream as a thumbnail.
@@ -12,7 +13,7 @@ import { Bitstream } from '../../../core/shared/bitstream.model';
styleUrls: ['./grid-thumbnail.component.scss'],
templateUrl: './grid-thumbnail.component.html'
})
export class GridThumbnailComponent {
export class GridThumbnailComponent implements OnInit {
@Input() thumbnail: Bitstream;
@@ -21,10 +22,19 @@ export class GridThumbnailComponent {
/**
* The default 'holder.js' image
*/
holderSource = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjYwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDI2MCAxODAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzEwMCV4MTgwL3RleHQ6Tm8gVGh1bWJuYWlsCkNyZWF0ZWQgd2l0aCBIb2xkZXIuanMgMi42LjAuCkxlYXJuIG1vcmUgYXQgaHR0cDovL2hvbGRlcmpzLmNvbQooYykgMjAxMi0yMDE1IEl2YW4gTWFsb3BpbnNreSAtIGh0dHA6Ly9pbXNreS5jbwotLT48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwhW0NEQVRBWyNob2xkZXJfMTVmNzJmMmFlMGIgdGV4dCB7IGZpbGw6I0FBQUFBQTtmb250LXdlaWdodDpib2xkO2ZvbnQtZmFtaWx5OkFyaWFsLCBIZWx2ZXRpY2EsIE9wZW4gU2Fucywgc2Fucy1zZXJpZiwgbW9ub3NwYWNlO2ZvbnQtc2l6ZToxM3B0IH0gXV0+PC9zdHlsZT48L2RlZnM+PGcgaWQ9ImhvbGRlcl8xNWY3MmYyYWUwYiI+PHJlY3Qgd2lkdGg9IjI2MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiNFRUVFRUUiLz48Zz48dGV4dCB4PSI3Mi4yNDIxODc1IiB5PSI5NiI+Tm8gVGh1bWJuYWlsPC90ZXh0PjwvZz48L2c+PC9zdmc+';
@Input() defaultImage? = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjYwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDI2MCAxODAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzEwMCV4MTgwL3RleHQ6Tm8gVGh1bWJuYWlsCkNyZWF0ZWQgd2l0aCBIb2xkZXIuanMgMi42LjAuCkxlYXJuIG1vcmUgYXQgaHR0cDovL2hvbGRlcmpzLmNvbQooYykgMjAxMi0yMDE1IEl2YW4gTWFsb3BpbnNreSAtIGh0dHA6Ly9pbXNreS5jbwotLT48ZGVmcz48c3R5bGUgdHlwZT0idGV4dC9jc3MiPjwhW0NEQVRBWyNob2xkZXJfMTVmNzJmMmFlMGIgdGV4dCB7IGZpbGw6I0FBQUFBQTtmb250LXdlaWdodDpib2xkO2ZvbnQtZmFtaWx5OkFyaWFsLCBIZWx2ZXRpY2EsIE9wZW4gU2Fucywgc2Fucy1zZXJpZiwgbW9ub3NwYWNlO2ZvbnQtc2l6ZToxM3B0IH0gXV0+PC9zdHlsZT48L2RlZnM+PGcgaWQ9ImhvbGRlcl8xNWY3MmYyYWUwYiI+PHJlY3Qgd2lkdGg9IjI2MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiNFRUVFRUUiLz48Zz48dGV4dCB4PSI3Mi4yNDIxODc1IiB5PSI5NiI+Tm8gVGh1bWJuYWlsPC90ZXh0PjwvZz48L2c+PC9zdmc+';
src: string;
errorHandler(event) {
event.currentTarget.src = this.holderSource;
event.currentTarget.src = this.defaultImage;
}
ngOnInit(): void {
if (hasValue(this.thumbnail) && this.thumbnail.content) {
this.src = this.thumbnail.content;
} else {
this.src = this.defaultImage
}
}
}

28
src/app/shared/object-grid/item-grid-element/item-grid-element.component.html
View File

@@ -1,28 +0,0 @@
<ds-truncatable [id]="object.id">
<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.firstMetadataValue('dc.title')}}</h4>
<ds-truncatable-part [id]="object.id" [minLines]="2">
<p *ngIf="object.hasMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*'])" class="item-authors card-text text-muted">
<span *ngFor="let author of object.allMetadataValues(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']); let last=last;">{{author}}
<span *ngIf="!last">; </span>
</span>
<span *ngIf="object.hasMetadata('dc.date.issued')" class="item-date">{{object.firstMetadataValue("dc.date.issued")}}</span>
</p>
</ds-truncatable-part>
<ds-truncatable-part [id]="object.id" [minLines]="5">
<p *ngIf="object.hasMetadata('dc.description.abstract')" class="item-abstract card-text">{{object.firstMetadataValue("dc.description.abstract")}}</p>
</ds-truncatable-part>
<div class="text-center pt-2">
<a [routerLink]="['/items/', object.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>
</ds-truncatable>

1
src/app/shared/object-grid/item-grid-element/item-grid-element.component.scss
View File

@@ -1 +0,0 @@

114
src/app/shared/object-grid/item-grid-element/item-grid-element.component.spec.ts
View File

@@ -1,114 +0,0 @@
import { ItemGridElementComponent } from './item-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ChangeDetectionStrategy, 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';
import { of as observableOf } from 'rxjs';
let itemGridElementComponent: ItemGridElementComponent;
let fixture: ComponentFixture<ItemGridElementComponent>;
const mockItemWithAuthorAndDate: Item = Object.assign(new Item(), {
bitstreams: observableOf({}),
metadata: {
'dc.contributor.author': [
{
language: 'en_US',
value: 'Smith, Donald'
}
],
'dc.date.issued': [
{
language: null,
value: '2015-06-26'
}
]
}
});
const mockItemWithoutAuthorAndDate: Item = Object.assign(new Item(), {
bitstreams: observableOf({}),
metadata: {
'dc.title': [
{
language: 'en_US',
value: 'This is just another title'
}
],
'dc.type': [
{
language: null,
value: 'Article'
}
]
}
});
describe('ItemGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ItemGridElementComponent , TruncatePipe],
providers: [
{ provide: 'objectElementProvider', useValue: {mockItemWithAuthorAndDate}}
],
schemas: [ NO_ERRORS_SCHEMA ]
}).overrideComponent(ItemGridElementComponent, {
set: { changeDetection: ChangeDetectionStrategy.Default }
}).compileComponents();
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(ItemGridElementComponent);
itemGridElementComponent = fixture.componentInstance;
}));
describe('When the item has an author', () => {
beforeEach(() => {
itemGridElementComponent.object = mockItemWithAuthorAndDate;
fixture.detectChanges();
});
it('should show the author paragraph', () => {
const itemAuthorField = fixture.debugElement.query(By.css('p.item-authors'));
expect(itemAuthorField).not.toBeNull();
});
});
describe('When the item has no author', () => {
beforeEach(() => {
itemGridElementComponent.object = mockItemWithoutAuthorAndDate;
fixture.detectChanges();
});
it('should not show the author paragraph', () => {
const itemAuthorField = fixture.debugElement.query(By.css('p.item-authors'));
expect(itemAuthorField).toBeNull();
});
});
describe('When the item has an issuedate', () => {
beforeEach(() => {
itemGridElementComponent.object = mockItemWithAuthorAndDate;
fixture.detectChanges();
});
it('should show the issuedate span', () => {
const itemAuthorField = fixture.debugElement.query(By.css('span.item-date'));
expect(itemAuthorField).not.toBeNull();
});
});
describe('When the item has no issuedate', () => {
beforeEach(() => {
itemGridElementComponent.object = mockItemWithoutAuthorAndDate;
fixture.detectChanges();
});
it('should not show the issuedate span', () => {
const dateField = fixture.debugElement.query(By.css('span.item-date'));
expect(dateField).toBeNull();
});
});
});

15
src/app/shared/object-grid/item-grid-element/item-grid-element.component.ts
View File

@@ -1,15 +0,0 @@
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 { SetViewMode } from '../../view-mode';
@Component({
selector: 'ds-item-grid-element',
styleUrls: ['./item-grid-element.component.scss'],
templateUrl: './item-grid-element.component.html'
})
@renderElementsFor(Item, SetViewMode.Grid)
export class ItemGridElementComponent extends AbstractListableElementComponent<Item> {}

1
src/app/shared/object-grid/item-grid-element/item-types/publication/publication-grid-element.component.html Normal file
View File

@@ -0,0 +1 @@
<ds-publication-search-result-grid-element [object]="{ indexableObject: object, hitHighlights: {} }" [linkType]="linkType"></ds-publication-search-result-grid-element>

0
src/app/shared/object-grid/item-grid-element/item-types/publication/publication-grid-element.component.scss Normal file
View File

81
src/app/shared/object-grid/item-grid-element/item-types/publication/publication-grid-element.component.spec.ts Normal file
View File

@@ -0,0 +1,81 @@
import { async, TestBed } from '@angular/core/testing';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { TruncatePipe } from '../../../../utils/truncate.pipe';
import { TruncatableService } from '../../../../truncatable/truncatable.service';
import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { PublicationGridElementComponent } from './publication-grid-element.component';
import { of as observableOf } from 'rxjs/internal/observable/of';
import { Item } from '../../../../../core/shared/item.model';
import { createSuccessfulRemoteDataObject$ } from '../../../../testing/utils';
import { PaginatedList } from '../../../../../core/data/paginated-list';
import { PageInfo } from '../../../../../core/shared/page-info.model';
const mockItem = Object.assign(new Item(), {
bitstreams: createSuccessfulRemoteDataObject$(new PaginatedList(new PageInfo(), [])),
metadata: {
'dc.title': [
{
language: 'en_US',
value: 'This is just another title'
}
],
'dc.contributor.author': [
{
language: 'en_US',
value: 'Smith, Donald'
}
],
'dc.date.issued': [
{
language: null,
value: '2015-06-26'
}
],
'dc.description.abstract': [
{
language: 'en_US',
value: 'This is an abstract'
}
]
}
});
describe('PublicationGridElementComponent', () => {
let comp;
let fixture;
const truncatableServiceStub: any = {
isCollapsed: (id: number) => observableOf(true),
};
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [NoopAnimationsModule],
declarations: [PublicationGridElementComponent, TruncatePipe],
providers: [
{ provide: TruncatableService, useValue: truncatableServiceStub },
],
schemas: [NO_ERRORS_SCHEMA]
}).overrideComponent(PublicationGridElementComponent, {
set: { changeDetection: ChangeDetectionStrategy.Default }
}).compileComponents();
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(PublicationGridElementComponent);
comp = fixture.componentInstance;
}));
describe(`when the publication is rendered`, () => {
beforeEach(() => {
comp.object = mockItem;
fixture.detectChanges();
});
it(`should contain a PublicationGridElementComponent`, () => {
const publicationGridElement = fixture.debugElement.query(By.css(`ds-publication-search-result-grid-element`));
expect(publicationGridElement).not.toBeNull();
});
});
});

20
src/app/shared/object-grid/item-grid-element/item-types/publication/publication-grid-element.component.ts Normal file
View File

@@ -0,0 +1,20 @@
import { Component } from '@angular/core';
import { focusShadow } from '../../../../animations/focus';
import { ViewMode } from '../../../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../../../object-collection/shared/listable-object/listable-object.decorator';
import { AbstractListableElementComponent } from '../../../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { Item } from '../../../../../core/shared/item.model';
@listableObjectComponent('Publication', ViewMode.GridElement)
@listableObjectComponent(Item, ViewMode.GridElement)
@Component({
selector: 'ds-publication-grid-element',
styleUrls: ['./publication-grid-element.component.scss'],
templateUrl: './publication-grid-element.component.html',
animations: [focusShadow]
})
/**
* The component for displaying a grid element for an item of the type Publication
*/
export class PublicationGridElementComponent extends AbstractListableElementComponent<Item> {
}

6
src/app/shared/object-grid/object-grid.component.html
View File

@@ -13,11 +13,11 @@
<div class="card-columns row" *ngIf="objects?.hasSucceeded">
<div class="card-column col col-sm-6 col-lg-4" *ngFor="let column of (columns$ | async)" @fadeIn>
<div class="card-element" *ngFor="let object of column">
<ds-wrapper-grid-element [object]="object"></ds-wrapper-grid-element>
<ds-listable-object-component-loader [object]="object" [viewMode]="viewMode" [context]="context" [linkType]="linkType"></ds-listable-object-component-loader>
</div>
</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-error *ngIf="objects.hasFailed" message="{{'error.objects' | translate}}"></ds-error>
<ds-loading *ngIf="objects.isLoading" message="{{'loading.objects' | translate}}"></ds-loading>
</ds-pagination>

7
src/app/shared/object-grid/object-grid.component.scss
View File

@@ -1,9 +1,14 @@
$ds-wrapper-grid-spacing: $spacer/2;
ds-wrapper-grid-element ::ng-deep {
:host ::ng-deep {
div.thumbnail > img {
height: $card-thumbnail-height;
width: 100%;
display: block;
min-width: 100%;
min-height: 100%;
object-fit: cover;
object-position: 50% 15%;
}
div.card {
margin-top: $ds-wrapper-grid-spacing;

73
src/app/shared/object-grid/object-grid.component.ts
View File

@@ -20,6 +20,9 @@ import { HostWindowService, WidthCategory } from '../host-window.service';
import { ListableObject } from '../object-collection/shared/listable-object.model';
import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
import { ViewMode } from '../../core/shared/view-mode.model';
import { Context } from '../../core/shared/context.model';
import { CollectionElementLinkType } from '../object-collection/collection-element-link.type';
@Component({
changeDetection: ChangeDetectionStrategy.Default,
@@ -31,17 +34,57 @@ import { PaginationComponentOptions } from '../pagination/pagination-component-o
})
export class ObjectGridComponent implements OnInit {
/**
* The view mode of the this component
*/
viewMode = ViewMode.GridElement;
/**
* The current pagination configuration
*/
@Input() config: PaginationComponentOptions;
/**
* The current sort configuration
*/
@Input() sortConfig: SortOptions;
/**
* The whether or not the gear is hidden
*/
@Input() hideGear = false;
/**
* Whether or not the pager is visible when there is only a single page of results
*/
@Input() hidePagerWhenSinglePage = true;
/**
* The link type of the listable elements
*/
@Input() linkType: CollectionElementLinkType;
/**
* The context of the listable elements
*/
@Input() context: Context;
/**
* Behavior subject to output the current listable objects
*/
private _objects$: BehaviorSubject<RemoteData<PaginatedList<ListableObject>>>;
/**
* Setter to make sure the observable is turned into an observable
* @param objects The new objects to output
*/
@Input() set objects(objects: RemoteData<PaginatedList<ListableObject>>) {
this._objects$.next(objects);
}
/**
* Getter to return the current objects
*/
get objects() {
return this._objects$.getValue();
}
@@ -76,7 +119,10 @@ export class ObjectGridComponent implements OnInit {
*/
@Output() sortDirectionChange: EventEmitter<SortDirection> = new EventEmitter<SortDirection>();
@Output() paginationChange: EventEmitter<SortDirection> = new EventEmitter<any>();
/**
* An event fired when on of the pagination parameters changes
*/
@Output() paginationChange: EventEmitter<any> = new EventEmitter<any>();
/**
* An event fired when the sort field is changed.
@@ -90,6 +136,9 @@ export class ObjectGridComponent implements OnInit {
this._objects$ = new BehaviorSubject(undefined);
}
/**
* Initialize the instance variables
*/
ngOnInit(): void {
const nbColumns$ = this.hostWindow.widthCategory.pipe(
map((widthCat: WidthCategory) => {
@@ -133,22 +182,40 @@ export class ObjectGridComponent implements OnInit {
}));
}
/**
* Emits the current page when it changes
* @param event The new page
*/
onPageChange(event) {
this.pageChange.emit(event);
}
/**
* Emits the current page size when it changes
* @param event The new page size
*/
onPageSizeChange(event) {
this.pageSizeChange.emit(event);
}
/**
* Emits the current sort direction when it changes
* @param event The new sort direction
*/
onSortDirectionChange(event) {
this.sortDirectionChange.emit(event);
}
/**
* Emits the current sort field when it changes
* @param event The new sort field
*/
onSortFieldChange(event) {
this.sortFieldChange.emit(event);
}
/**
* Emits the current pagination when it changes
* @param event The new pagination
*/
onPaginationChange(event) {
this.paginationChange.emit(event);
}

10
src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.html
View File

@@ -1,13 +1,17 @@
<div class="card">
<a [routerLink]="['/collections/', dso.id]" class="card-img-top">
<a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/collections/', dso.id]" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="dso.logo">
</ds-grid-thumbnail>
</a>
<span *ngIf="linkType == linkTypes.None" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="dso.logo">
</ds-grid-thumbnail>
</span>
<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 *ngIf="linkType != linkTypes.None" class="text-center">
<a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/collections/', dso.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

10
src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
View File

@@ -1,16 +1,18 @@
import { Component } from '@angular/core';
import { renderElementsFor} from '../../../object-collection/shared/dso-element-decorator';
import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
import { Collection } from '../../../../core/shared/collection.model';
import { SetViewMode } from '../../../view-mode';
import { CollectionSearchResult } from '../../../object-collection/shared/collection-search-result.model';
import { ViewMode } from '../../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../../object-collection/shared/listable-object/listable-object.decorator';
@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, SetViewMode.Grid)
/**
* Component representing a grid element for a collection search result
*/
@listableObjectComponent(CollectionSearchResult, ViewMode.GridElement)
export class CollectionSearchResultGridElementComponent extends SearchResultGridElementComponent<CollectionSearchResult, Collection> {}

11
src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.html
View File

@@ -1,14 +1,17 @@
<div class="card">
<a [routerLink]="['/communities/', dso.id]" class="card-img-top">
<a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/communities/', dso.id]" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="dso.logo">
</ds-grid-thumbnail>
</a>
<span *ngIf="linkType == linkTypes.None" class="card-img-top">
<ds-grid-thumbnail [thumbnail]="dso.logo">
</ds-grid-thumbnail>
</span>
<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 *ngIf="linkType != linkTypes.None" class="text-center">
<a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/communities/', dso.id]" class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>

11
src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
View File

@@ -1,17 +1,18 @@
import { Component } from '@angular/core';
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 { SetViewMode } from '../../../view-mode';
import { CommunitySearchResult } from '../../../object-collection/shared/community-search-result.model';
import { ViewMode } from '../../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../../object-collection/shared/listable-object/listable-object.decorator';
@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, SetViewMode.Grid)
/**
* Component representing a grid element for a community search result
*/
@listableObjectComponent(CommunitySearchResult, ViewMode.GridElement)
export class CommunitySearchResultGridElementComponent extends SearchResultGridElementComponent<CommunitySearchResult, Community> {
}

33
src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.html
View File

@@ -1,33 +0,0 @@
<ds-truncatable [id]="dso.id">
<div class="card" [@focusShadow]="(isCollapsed() | async)?'blur':'focus'">
<a [routerLink]="['/items/' + dso.id]" class="card-img-top full-width">
<div>
<ds-grid-thumbnail [thumbnail]="dso.getThumbnail()">
</ds-grid-thumbnail>
</div>
</a>
<div class="card-body">
<ds-truncatable-part [fixedHeight]="true" [id]="dso.id" [minLines]="3" type="h4">
<h4 class="card-title" [innerHTML]="dso.firstMetadataValue('dc.title')"></h4>
</ds-truncatable-part>
<p *ngIf="dso.hasMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*'])"
class="item-authors card-text text-muted">
<ds-truncatable-part [fixedHeight]="true" [id]="dso.id" [minLines]="1">
<span *ngIf="dso.hasMetadata('dc.date.issued')" class="item-date">{{dso.firstMetadataValue('dc.date.issued')}}</span>
<span *ngFor="let author of dso.allMetadataValues(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']);">,
<span [innerHTML]="author"></span>
</span>
</ds-truncatable-part>
</p>
<p class="item-abstract card-text">
<ds-truncatable-part [fixedHeight]="true" [id]="dso.id" [minLines]="3">
<span [innerHTML]="firstMetadataValue('dc.description.abstract')"></span>
</ds-truncatable-part>
</p>
<div class="text-center">
<a [routerLink]="['/items/' + dso.id]"
class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>
</ds-truncatable>

12
src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.scss
View File

@@ -1,12 +0,0 @@
.card {
a > div {
position: relative;
.thumbnail-overlay {
height: 100%;
position: absolute;
top: 0;
width: 100%;
background-color: map-get($theme-colors, primary);
}
}
}

126
src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.spec.ts
View File

@@ -1,126 +0,0 @@
import { ItemSearchResultGridElementComponent } from './item-search-result-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { of as observableOf } from 'rxjs';
import { ChangeDetectionStrategy, 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';
import { TruncatableService } from '../../../truncatable/truncatable.service';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { ItemSearchResult } from '../../../object-collection/shared/item-search-result.model';
let itemSearchResultGridElementComponent: ItemSearchResultGridElementComponent;
let fixture: ComponentFixture<ItemSearchResultGridElementComponent>;
const truncatableServiceStub: any = {
isCollapsed: (id: number) => observableOf(true),
};
const mockItemWithAuthorAndDate: ItemSearchResult = new ItemSearchResult();
mockItemWithAuthorAndDate.hitHighlights = {};
mockItemWithAuthorAndDate.indexableObject = Object.assign(new Item(), {
bitstreams: observableOf({}),
metadata: {
'dc.contributor.author': [
{
language: 'en_US',
value: 'Smith, Donald'
}
],
'dc.date.issued': [
{
language: null,
value: '2015-06-26'
}
]
}
});
const mockItemWithoutAuthorAndDate: ItemSearchResult = new ItemSearchResult();
mockItemWithoutAuthorAndDate.hitHighlights = {};
mockItemWithoutAuthorAndDate.indexableObject = Object.assign(new Item(), {
bitstreams: observableOf({}),
metadata: {
'dc.title': [
{
language: 'en_US',
value: 'This is just another title'
}
],
'dc.type': [
{
language: null,
value: 'Article'
}
]
}
});
describe('ItemSearchResultGridElementComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [NoopAnimationsModule],
declarations: [ItemSearchResultGridElementComponent, TruncatePipe],
providers: [
{ provide: TruncatableService, useValue: truncatableServiceStub },
{ provide: 'objectElementProvider', useValue: (mockItemWithoutAuthorAndDate) }
],
schemas: [NO_ERRORS_SCHEMA]
}).overrideComponent(ItemSearchResultGridElementComponent, {
set: { changeDetection: ChangeDetectionStrategy.Default }
}).compileComponents();
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(ItemSearchResultGridElementComponent);
itemSearchResultGridElementComponent = fixture.componentInstance;
}));
describe('When the item has an author', () => {
beforeEach(() => {
itemSearchResultGridElementComponent.dso = mockItemWithAuthorAndDate.indexableObject;
fixture.detectChanges();
});
it('should show the author paragraph', () => {
const itemAuthorField = fixture.debugElement.query(By.css('p.item-authors'));
expect(itemAuthorField).not.toBeNull();
});
});
describe('When the item has no author', () => {
beforeEach(() => {
itemSearchResultGridElementComponent.dso = mockItemWithoutAuthorAndDate.indexableObject;
fixture.detectChanges();
});
it('should not show the author paragraph', () => {
const itemAuthorField = fixture.debugElement.query(By.css('p.item-authors'));
expect(itemAuthorField).toBeNull();
});
});
describe('When the item has an issuedate', () => {
beforeEach(() => {
itemSearchResultGridElementComponent.dso = mockItemWithAuthorAndDate.indexableObject;
fixture.detectChanges();
});
it('should show the issuedate span', () => {
const itemAuthorField = fixture.debugElement.query(By.css('span.item-date'));
expect(itemAuthorField).not.toBeNull();
});
});
describe('When the item has no issuedate', () => {
beforeEach(() => {
itemSearchResultGridElementComponent.dso = mockItemWithoutAuthorAndDate.indexableObject;
fixture.detectChanges();
});
it('should not show the issuedate span', () => {
const dateField = fixture.debugElement.query(By.css('span.item-date'));
expect(dateField).toBeNull();
});
});
});

18
src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.ts
View File

@@ -1,18 +0,0 @@
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 { SetViewMode } from '../../../view-mode';
import { focusShadow } from '../../../../shared/animations/focus';
@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',
animations: [focusShadow],
})
@renderElementsFor(ItemSearchResult, SetViewMode.Grid)
export class ItemSearchResultGridElementComponent extends SearchResultGridElementComponent<ItemSearchResult, Item> {}

41
src/app/shared/object-grid/search-result-grid-element/item-search-result/publication/publication-search-result-grid-element.component.html Normal file
View File

@@ -0,0 +1,41 @@
<ds-truncatable [id]="dso.id">
<div class="card" [@focusShadow]="(isCollapsed$ | async)?'blur':'focus'">
<a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/items/' + dso.id]"
class="card-img-top full-width">
<div>
<ds-grid-thumbnail [thumbnail]="this.dso.getThumbnail() | async">
</ds-grid-thumbnail>
</div>
</a>
<span *ngIf="linkType == linkTypes.None" class="card-img-top full-width">
<div>
<ds-grid-thumbnail [thumbnail]="dso.getThumbnail() | async">
</ds-grid-thumbnail>
</div>
</span>
<div class="card-body">
<ds-item-type-badge [object]="dso"></ds-item-type-badge>
<ds-truncatable-part [id]="dso.id" [minLines]="3" type="h4">
<h4 class="card-title" [innerHTML]="firstMetadataValue('dc.title')"></h4>
</ds-truncatable-part>
<p *ngIf="dso.hasMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*'])"
class="item-authors card-text text-muted">
<ds-truncatable-part [id]="dso.id" [minLines]="1">
<span *ngIf="dso.hasMetadata('dc.date.issued')" class="item-date">{{firstMetadataValue('dc.date.issued')}}</span>
<span *ngFor="let author of allMetadataValues(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']);">,
<span [innerHTML]="author"></span>
</span>
</ds-truncatable-part>
</p>
<p *ngIf="dso.hasMetadata('dc.description.abstract')" class="item-abstract card-text">
<ds-truncatable-part [id]="dso.id" [minLines]="3">
<span [innerHTML]="firstMetadataValue('dc.description.abstract')"></span>
</ds-truncatable-part>
</p>
<div *ngIf="linkType != linkTypes.None" class="text-center">
<a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" rel="noopener noreferrer" [routerLink]="['/items/' + dso.id]"
class="lead btn btn-primary viewButton">View</a>
</div>
</div>
</div>
</ds-truncatable>

0
src/app/shared/object-grid/search-result-grid-element/item-search-result/publication/publication-search-result-grid-element.component.scss Normal file
View File

125
src/app/shared/object-grid/search-result-grid-element/item-search-result/publication/publication-search-result-grid-element.component.spec.ts Normal file
View File

@@ -0,0 +1,125 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { TruncatePipe } from '../../../../utils/truncate.pipe';
import { TruncatableService } from '../../../../truncatable/truncatable.service';
import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
import { By } from '@angular/platform-browser';
import { of as observableOf } from 'rxjs/internal/observable/of';
import { ItemSearchResult } from '../../../../object-collection/shared/item-search-result.model';
import { Item } from '../../../../../core/shared/item.model';
import { createSuccessfulRemoteDataObject$ } from '../../../../testing/utils';
import { PaginatedList } from '../../../../../core/data/paginated-list';
import { PageInfo } from '../../../../../core/shared/page-info.model';
import { PublicationSearchResultGridElementComponent } from './publication-search-result-grid-element.component';
const mockItemWithMetadata: ItemSearchResult = new ItemSearchResult();
mockItemWithMetadata.hitHighlights = {};
mockItemWithMetadata.indexableObject = Object.assign(new Item(), {
bitstreams: createSuccessfulRemoteDataObject$(new PaginatedList(new PageInfo(), [])),
metadata: {
'dc.title': [
{
language: 'en_US',
value: 'This is just another title'
}
],
'dc.contributor.author': [
{
language: 'en_US',
value: 'Smith, Donald'
}
],
'dc.date.issued': [
{
language: null,
value: '2015-06-26'
}
],
'dc.description.abstract': [
{
language: 'en_US',
value: 'This is an abstract'
}
]
}
});
const mockItemWithoutMetadata: ItemSearchResult = new ItemSearchResult();
mockItemWithoutMetadata.hitHighlights = {};
mockItemWithoutMetadata.indexableObject = Object.assign(new Item(), {
bitstreams: createSuccessfulRemoteDataObject$(new PaginatedList(new PageInfo(), [])),
metadata: {
'dc.title': [
{
language: 'en_US',
value: 'This is just another title'
}
]
}
});
describe('PublicationGridElementComponent', getEntityGridElementTestComponent(PublicationSearchResultGridElementComponent, mockItemWithMetadata, mockItemWithoutMetadata, ['authors', 'date', 'abstract']));
/**
* Create test cases for a grid component of an entity.
* @param component The component's class
* @param searchResultWithMetadata An ItemSearchResult containing an item with metadata that should be displayed in the grid element
* @param searchResultWithoutMetadata An ItemSearchResult containing an item that's missing the metadata that should be displayed in the grid element
* @param fieldsToCheck A list of fields to check. The tests expect to find html elements with class ".item-${field}", so make sure they exist in the html template of the grid element.
* For example: If one of the fields to check is labeled "authors", the html template should contain at least one element with class ".item-authors" that's
* present when the author metadata is available.
*/
export function getEntityGridElementTestComponent(component, searchResultWithMetadata: ItemSearchResult, searchResultWithoutMetadata: ItemSearchResult, fieldsToCheck: string[]) {
return () => {
let comp;
let fixture;
const truncatableServiceStub: any = {
isCollapsed: (id: number) => observableOf(true),
};
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [NoopAnimationsModule],
declarations: [component, TruncatePipe],
providers: [
{ provide: TruncatableService, useValue: truncatableServiceStub },
],
schemas: [NO_ERRORS_SCHEMA]
}).overrideComponent(component, {
set: { changeDetection: ChangeDetectionStrategy.Default }
}).compileComponents();
}));
beforeEach(async(() => {
fixture = TestBed.createComponent(component);
comp = fixture.componentInstance;
}));
fieldsToCheck.forEach((field) => {
describe(`when the item has "${field}" metadata`, () => {
beforeEach(() => {
comp.object = searchResultWithMetadata;
fixture.detectChanges();
});
it(`should show the "${field}" field`, () => {
const itemAuthorField = fixture.debugElement.query(By.css(`.item-${field}`));
expect(itemAuthorField).not.toBeNull();
});
});
describe(`when the item has no "${field}" metadata`, () => {
beforeEach(() => {
comp.object = searchResultWithoutMetadata;
fixture.detectChanges();
});
it(`should not show the "${field}" field`, () => {
const itemAuthorField = fixture.debugElement.query(By.css(`.item-${field}`));
expect(itemAuthorField).toBeNull();
});
});
});
}
}

20
src/app/shared/object-grid/search-result-grid-element/item-search-result/publication/publication-search-result-grid-element.component.ts Normal file
View File

@@ -0,0 +1,20 @@
import { Component } from '@angular/core';
import { focusShadow } from '../../../../animations/focus';
import { ViewMode } from '../../../../../core/shared/view-mode.model';
import { listableObjectComponent } from '../../../../object-collection/shared/listable-object/listable-object.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';
@listableObjectComponent('PublicationSearchResult', ViewMode.GridElement)
@Component({
selector: 'ds-publication-search-result-grid-element',
styleUrls: ['./publication-search-result-grid-element.component.scss'],
templateUrl: './publication-search-result-grid-element.component.html',
animations: [focusShadow]
})
/**
* The component for displaying a grid element for an item search result of the type Publication
*/
export class PublicationSearchResultGridElementComponent extends SearchResultGridElementComponent<ItemSearchResult, Item> {
}

34
src/app/shared/object-grid/search-result-grid-element/search-result-grid-element.component.ts
View File

@@ -1,24 +1,43 @@
import { Component, Inject } from '@angular/core';
import { Component, Inject, OnInit } from '@angular/core';
import { SearchResult } from '../../search/search-result.model';
import { DSpaceObject } from '../../../core/shared/dspace-object.model';
import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
import { ListableObject } from '../../object-collection/shared/listable-object.model';
import { TruncatableService } from '../../truncatable/truncatable.service';
import { Observable } from 'rxjs';
import { Metadata } from '../../../core/shared/metadata.utils';
import { hasValue } from '../../empty.util';
@Component({
selector: 'ds-search-result-grid-element',
template: ``
})
export class SearchResultGridElementComponent<T extends SearchResult<K>, K extends DSpaceObject> extends AbstractListableElementComponent<T> {
export class SearchResultGridElementComponent<T extends SearchResult<K>, K extends DSpaceObject> extends AbstractListableElementComponent<T> implements OnInit {
/**
* The DSpaceObject of the search result
*/
dso: K;
public constructor(@Inject('objectElementProvider') public listableObject: ListableObject, private truncatableService: TruncatableService) {
super(listableObject);
this.dso = this.object.indexableObject;
/**
* Whether or not the grid element is currently collapsed
*/
isCollapsed$: Observable<boolean>;
public constructor(protected truncatableService: TruncatableService) {
super();
if (hasValue(this.object)) {
this.isCollapsed$ = this.isCollapsed();
}
}
/**
* Retrieve the dso from the search result
*/
ngOnInit(): void {
if (hasValue(this.object)) {
this.dso = this.object.indexableObject;
}
}
/**
@@ -41,8 +60,7 @@ export class SearchResultGridElementComponent<T extends SearchResult<K>, K exten
return Metadata.firstValue([this.object.hitHighlights, this.dso.metadata], keyOrKeys);
}
isCollapsed(): Observable<boolean> {
private isCollapsed(): Observable<boolean> {
return this.truncatableService.isCollapsed(this.dso.id);
}
}

1
src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.html
View File

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

1
src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.scss
View File

@@ -1 +0,0 @@

43
src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.spec.ts
View File

@@ -1,43 +0,0 @@
import { WrapperGridElementComponent } from './wrapper-grid-element.component';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { of as observableOf } from 'rxjs';
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: observableOf({
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();
})
})

31
src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.ts
View File

@@ -1,31 +0,0 @@
import { Component, Injector, Input, OnInit } from '@angular/core';
import { SetViewMode } from '../../view-mode';
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';
@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 = Injector.create({
providers: [{ provide: 'objectElementProvider', useFactory: () => (this.object), deps:[] }],
parent: this.injector
});
}
getGridElement(): string {
const f: GenericConstructor<ListableObject> = this.object.constructor as GenericConstructor<ListableObject>;
return rendersDSOType(f, SetViewMode.Grid);
}
}