hazza/yel-dspace-angular
1
0
Fork 0
forked from hazza/dspace-angular
Code Pull Requests Activity

refactored template variables

Browse Source
This commit is contained in:
Art Lowel
2017-10-27 17:57:28 +02:00
parent 4628d7731f
commit ce330fcb47
22 changed files with 219 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/app/+collection-page/collection-page.component.html
View File

@@ -1,51 +1,55 @@
<div class="collection-page"> <div class="collection-page"
<div *ngIf="(collectionData | async)?.hasSucceeded" @fadeInOut> *ngVar="(collectionRDObs | async) as collectionRD"
<div *ngIf="(collectionData | async)?.payload; let collectionPayload"> >
<div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
<div *ngIf="collectionRD?.payload as collection">
<!-- Collection Name --> <!-- Collection Name -->
<ds-comcol-page-header <ds-comcol-page-header
[name]="collectionPayload.name"> [name]="collection.name">
</ds-comcol-page-header> </ds-comcol-page-header>
<!-- Collection logo --> <!-- Collection logo -->
<ds-comcol-page-logo *ngIf="logoData" <ds-comcol-page-logo *ngIf="logoRDObs"
[logo]="(logoData | async)?.payload" [logo]="(logoRDObs | async)?.payload"
[alternateText]="'Collection Logo'"> [alternateText]="'Collection Logo'">
</ds-comcol-page-logo> </ds-comcol-page-logo>
<!-- Introductionary text --> <!-- Introductionary text -->
<ds-comcol-page-content <ds-comcol-page-content
[content]="collectionPayload.introductoryText" [content]="collection.introductoryText"
[hasInnerHtml]="true"> [hasInnerHtml]="true">
</ds-comcol-page-content> </ds-comcol-page-content>
<!-- News --> <!-- News -->
<ds-comcol-page-content <ds-comcol-page-content
[content]="collectionPayload.sidebarText" [content]="collection.sidebarText"
[hasInnerHtml]="true" [hasInnerHtml]="true"
[title]="'community.page.news'"> [title]="'community.page.news'">
</ds-comcol-page-content> </ds-comcol-page-content>
<!-- Copyright --> <!-- Copyright -->
<ds-comcol-page-content <ds-comcol-page-content
[content]="collectionPayload.copyrightText" [content]="collection.copyrightText"
[hasInnerHtml]="true"> [hasInnerHtml]="true">
</ds-comcol-page-content> </ds-comcol-page-content>
<!-- Licence --> <!-- Licence -->
<ds-comcol-page-content <ds-comcol-page-content
[content]="collectionPayload.license" [content]="collection.license"
[title]="'collection.page.license'"> [title]="'collection.page.license'">
</ds-comcol-page-content> </ds-comcol-page-content>
</div> </div>
</div> </div>
<ds-error *ngIf="(collectionData | async)?.hasFailed" message="{{'error.collection' | translate}}"></ds-error> <ds-error *ngIf="collectionRD?.hasFailed" message="{{'error.collection' | translate}}"></ds-error>
<ds-loading *ngIf="(collectionData | async)?.isLoading" message="{{'loading.collection' | translate}}"></ds-loading> <ds-loading *ngIf="collectionRD?.isLoading" message="{{'loading.collection' | translate}}"></ds-loading>
<br> <br>
<div *ngIf="(itemData | async)?.hasSucceeded" @fadeIn> <ng-container *ngVar="(itemRDObs | async) as itemRD">
<h2>{{'collection.page.browse.recent.head' | translate}}</h2> <div *ngIf="itemRD?.hasSucceeded" @fadeIn>
<ds-object-list <h2>{{'collection.page.browse.recent.head' | translate}}</h2>
[config]="paginationConfig" <ds-object-list
[sortConfig]="sortConfig" [config]="paginationConfig"
[objects]="(itemData | async)" [sortConfig]="sortConfig"
[hideGear]="false" [objects]="itemRD"
(paginationChange)="onPaginationChange($event)"> [hideGear]="false"
</ds-object-list> (paginationChange)="onPaginationChange($event)">
</div> </ds-object-list>
<ds-error *ngIf="(itemData | async)?.hasFailed" message="{{'error.recent-submissions' | translate}}"></ds-error> </div>
<ds-loading *ngIf="!itemData || (itemData | async).isLoading" message="{{'loading.recent-submissions' | translate}}"></ds-loading> <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>
</ng-container>
</div> </div>

16
src/app/+collection-page/collection-page.component.ts
View File

@@ -29,9 +29,9 @@ import { PaginationComponentOptions } from '../shared/pagination/pagination-comp
] ]
}) })
export class CollectionPageComponent implements OnInit, OnDestroy { export class CollectionPageComponent implements OnInit, OnDestroy {
collectionData: Observable<RemoteData<Collection>>; collectionRDObs: Observable<RemoteData<Collection>>;
itemData: Observable<RemoteData<Item[]>>; itemRDObs: Observable<RemoteData<Item[]>>;
logoData: Observable<RemoteData<Bitstream>>; logoRDObs: Observable<RemoteData<Bitstream>>;
paginationConfig: PaginationComponentOptions; paginationConfig: PaginationComponentOptions;
sortConfig: SortOptions; sortConfig: SortOptions;
private subs: Subscription[] = []; private subs: Subscription[] = [];
@@ -60,12 +60,12 @@ export class CollectionPageComponent implements OnInit, OnDestroy {
}) })
.subscribe((params) => { .subscribe((params) => {
this.collectionId = params.id; this.collectionId = params.id;
this.collectionData = this.collectionDataService.findById(this.collectionId); this.collectionRDObs = this.collectionDataService.findById(this.collectionId);
this.metadata.processRemoteData(this.collectionData); this.metadata.processRemoteData(this.collectionRDObs);
this.subs.push(this.collectionData this.subs.push(this.collectionRDObs
.map((rd: RemoteData<Collection>) => rd.payload) .map((rd: RemoteData<Collection>) => rd.payload)
.filter((collection: Collection) => hasValue(collection)) .filter((collection: Collection) => hasValue(collection))
.subscribe((collection: Collection) => this.logoData = collection.logo)); .subscribe((collection: Collection) => this.logoRDObs = collection.logo));
const page = +params.page || this.paginationConfig.currentPage; const page = +params.page || this.paginationConfig.currentPage;
const pageSize = +params.pageSize || this.paginationConfig.pageSize; const pageSize = +params.pageSize || this.paginationConfig.pageSize;
@@ -87,7 +87,7 @@ export class CollectionPageComponent implements OnInit, OnDestroy {
} }
updatePage(searchOptions) { updatePage(searchOptions) {
this.itemData = this.itemDataService.findAll({ this.itemRDObs = this.itemDataService.findAll({
scopeID: this.collectionId, scopeID: this.collectionId,
currentPage: searchOptions.pagination.currentPage, currentPage: searchOptions.pagination.currentPage,
elementsPerPage: searchOptions.pagination.pageSize, elementsPerPage: searchOptions.pagination.pageSize,

60
src/app/+community-page/community-page.component.html
View File

@@ -1,30 +1,32 @@
<div class="community-page" *ngIf="(communityData | async)?.hasSucceeded" @fadeInOut> <ng-container *ngVar="(communityRDObs | async) as communityRD">
<div *ngIf="(communityData | async)?.payload; let communityPayload"> <div class="community-page" *ngIf="communityRD?.hasSucceeded" @fadeInOut>
<!-- Community name --> <div *ngIf="communityRD?.payload; let communityPayload">
<ds-comcol-page-header [name]="communityPayload.name"></ds-comcol-page-header> <!-- Community name -->
<!-- Community logo --> <ds-comcol-page-header [name]="communityPayload.name"></ds-comcol-page-header>
<ds-comcol-page-logo *ngIf="logoData" <!-- Community logo -->
[logo]="(logoData | async)?.payload" <ds-comcol-page-logo *ngIf="logoRDObs"
[alternateText]="'Community Logo'"> [logo]="(logoRDObs | async)?.payload"
</ds-comcol-page-logo> [alternateText]="'Community Logo'">
<!-- Introductionary text --> </ds-comcol-page-logo>
<ds-comcol-page-content <!-- Introductionary text -->
[content]="communityPayload.introductoryText" <ds-comcol-page-content
[hasInnerHtml]="true"> [content]="communityPayload.introductoryText"
</ds-comcol-page-content> [hasInnerHtml]="true">
<!-- News --> </ds-comcol-page-content>
<ds-comcol-page-content <!-- News -->
[content]="communityPayload.sidebarText" <ds-comcol-page-content
[hasInnerHtml]="true" [content]="communityPayload.sidebarText"
[title]="'community.page.news'"> [hasInnerHtml]="true"
</ds-comcol-page-content> [title]="'community.page.news'">
<!-- Copyright --> </ds-comcol-page-content>
<ds-comcol-page-content <!-- Copyright -->
[content]="communityPayload.copyrightText" <ds-comcol-page-content
[hasInnerHtml]="true"> [content]="communityPayload.copyrightText"
</ds-comcol-page-content> [hasInnerHtml]="true">
<ds-community-page-sub-collection-list></ds-community-page-sub-collection-list> </ds-comcol-page-content>
<ds-community-page-sub-collection-list></ds-community-page-sub-collection-list>
</div>
</div> </div>
</div> <ds-error *ngIf="communityRD?.hasFailed" message="{{'error.community' | translate}}"></ds-error>
<ds-error *ngIf="(communityData | async)?.hasFailed" message="{{'error.community' | translate}}"></ds-error> <ds-loading *ngIf="communityRD?.isLoading" message="{{'loading.community' | translate}}"></ds-loading>
<ds-loading *ngIf="(communityData | async)?.isLoading" message="{{'loading.community' | translate}}"></ds-loading> </ng-container>

12
src/app/+community-page/community-page.component.ts
View File

@@ -22,8 +22,8 @@ import { Observable } from 'rxjs/Observable';
animations: [fadeInOut] animations: [fadeInOut]
}) })
export class CommunityPageComponent implements OnInit, OnDestroy { export class CommunityPageComponent implements OnInit, OnDestroy {
communityData: Observable<RemoteData<Community>>; communityRDObs: Observable<RemoteData<Community>>;
logoData: Observable<RemoteData<Bitstream>>; logoRDObs: Observable<RemoteData<Bitstream>>;
private subs: Subscription[] = []; private subs: Subscription[] = [];
constructor( constructor(
@@ -36,12 +36,12 @@ export class CommunityPageComponent implements OnInit, OnDestroy {
ngOnInit(): void { ngOnInit(): void {
this.route.params.subscribe((params: Params) => { this.route.params.subscribe((params: Params) => {
this.communityData = this.communityDataService.findById(params.id); this.communityRDObs = this.communityDataService.findById(params.id);
this.metadata.processRemoteData(this.communityData); this.metadata.processRemoteData(this.communityRDObs);
this.subs.push(this.communityData this.subs.push(this.communityRDObs
.map((rd: RemoteData<Community>) => rd.payload) .map((rd: RemoteData<Community>) => rd.payload)
.filter((community: Community) => hasValue(community)) .filter((community: Community) => hasValue(community))
.subscribe((community: Community) => this.logoData = community.logo)); .subscribe((community: Community) => this.logoRDObs = community.logo));
}); });
} }

28
src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html
View File

@@ -1,13 +1,15 @@
<div *ngIf="(subCollections | async)?.hasSucceeded" @fadeIn> <ng-container *ngVar="(subCollectionsRDObs | async) as subCollectionsRD">
<h2>{{'community.sub-collection-list.head' | translate}}</h2> <div *ngIf="subCollectionsRD?.hasSucceeded" @fadeIn>
<ul> <h2>{{'community.sub-collection-list.head' | translate}}</h2>
<li *ngFor="let collection of (subCollections | async)?.payload"> <ul>
<p> <li *ngFor="let collection of subCollectionsRD?.payload">
<span class="lead"><a [routerLink]="['/collections', collection.id]">{{collection.name}}</a></span><br> <p>
<span class="text-muted">{{collection.shortDescription}}</span> <span class="lead"><a [routerLink]="['/collections', collection.id]">{{collection.name}}</a></span><br>
</p> <span class="text-muted">{{collection.shortDescription}}</span>
</li> </p>
</ul> </li>
</div> </ul>
<ds-error *ngIf="(subCollections | async)?.hasFailed" message="{{'error.sub-collections' | translate}}"></ds-error> </div>
<ds-loading *ngIf="(subCollections | async)?.isLoading" message="{{'loading.sub-collections' | translate}}"></ds-loading> <ds-error *ngIf="subCollectionsRD?.hasFailed" message="{{'error.sub-collections' | translate}}"></ds-error>
<ds-loading *ngIf="subCollectionsRD?.isLoading" message="{{'loading.sub-collections' | translate}}"></ds-loading>
</ng-container>

4
src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.ts
View File

@@ -14,13 +14,13 @@ import { Observable } from 'rxjs/Observable';
animations:[fadeIn] animations:[fadeIn]
}) })
export class CommunityPageSubCollectionListComponent implements OnInit { export class CommunityPageSubCollectionListComponent implements OnInit {
subCollections: Observable<RemoteData<Collection[]>>; subCollectionsRDObs: Observable<RemoteData<Collection[]>>;
constructor(private cds: CollectionDataService) { constructor(private cds: CollectionDataService) {
} }
ngOnInit(): void { ngOnInit(): void {
this.subCollections = this.cds.findAll(); this.subCollectionsRDObs = this.cds.findAll();
} }
} }

28
src/app/+home-page/top-level-community-list/top-level-community-list.component.html
View File

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

4
src/app/+home-page/top-level-community-list/top-level-community-list.component.ts
View File

@@ -17,7 +17,7 @@ import { PaginationComponentOptions } from '../../shared/pagination/pagination-c
animations: [fadeInOut] animations: [fadeInOut]
}) })
export class TopLevelCommunityListComponent { export class TopLevelCommunityListComponent {
topLevelCommunities: Observable<RemoteData<Community[]>>; communitiesRDObs: Observable<RemoteData<Community[]>>;
config: PaginationComponentOptions; config: PaginationComponentOptions;
sortConfig: SortOptions; sortConfig: SortOptions;
@@ -37,7 +37,7 @@ export class TopLevelCommunityListComponent {
} }
updatePage(data) { updatePage(data) {
this.topLevelCommunities = this.cds.findAll({ this.communitiesRDObs = this.cds.findAll({
currentPage: data.page, currentPage: data.page,
elementsPerPage: data.pageSize, elementsPerPage: data.pageSize,
sort: { field: data.sortField, direction: data.sortDirection } sort: { field: data.sortField, direction: data.sortDirection }

4
src/app/+item-page/full/field-components/file-section/full-file-section.component.html
View File

@@ -1,5 +1,5 @@
<ds-metadata-field-wrapper [label]="label | translate"> <ds-metadata-field-wrapper [label]="label | translate">
<div class="file-section row" *ngFor="let file of (files | async); let last=last;"> <div class="file-section row" *ngFor="let file of (bitstreamsObs | async); let last=last;">
<div class="col-3"> <div class="col-3">
<ds-thumbnail [thumbnail]="thumbnails.get(file.id) | async"></ds-thumbnail> <ds-thumbnail [thumbnail]="thumbnails.get(file.id) | async"></ds-thumbnail>
</div> </div>
@@ -13,7 +13,7 @@
<dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt> <dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt>
<dd class="col-md-8">{{(file.mimetype)}}</dd> <dd class="col-md-8">{{(file.format.)}}</dd>
<dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt> <dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt>

6
src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
View File

@@ -22,7 +22,7 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
label: string; label: string;
files: Observable<Bitstream[]>; bitstreamsObs: Observable<Bitstream[]>;
thumbnails: Map<string, Observable<Bitstream>> = new Map(); thumbnails: Map<string, Observable<Bitstream>> = new Map();
@@ -33,8 +33,8 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
initialize(): void { initialize(): void {
const originals = this.item.getFiles(); const originals = this.item.getFiles();
const licenses = this.item.getBitstreamsByBundleName('LICENSE'); const licenses = this.item.getBitstreamsByBundleName('LICENSE');
this.files = Observable.combineLatest(originals, licenses, (o, l) => [...o, ...l]); this.bitstreamsObs = Observable.combineLatest(originals, licenses, (o, l) => [...o, ...l]);
this.files.subscribe( this.bitstreamsObs.subscribe(
(files) => (files) =>
files.forEach( files.forEach(
(original) => { (original) => {

38
src/app/+item-page/full/full-item-page.component.html
View File

@@ -1,23 +1,25 @@
<div class="item-page" *ngIf="(item | async)?.hasSucceeded" @fadeInOut> <ng-container *ngVar="(itemRDObs | async) as itemRD">
<div *ngIf="(item | async)?.payload; let itemPayload"> <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
<ds-item-page-title-field [item]="itemPayload"></ds-item-page-title-field> <div *ngIf="itemRD?.payload as item">
<div class="simple-view-link"> <ds-item-page-title-field [item]="item"></ds-item-page-title-field>
<a class="btn btn-outline-primary col-4" [routerLink]="['/items/' + itemPayload.id]"> <div class="simple-view-link">
{{"item.page.link.simple" | translate}} <a class="btn btn-outline-primary col-4" [routerLink]="['/items/' + item.id]">
</a> {{"item.page.link.simple" | translate}}
</div> </a>
<table class="table table-responsive table-striped"> </div>
<tbody> <table class="table table-responsive table-striped">
<tr *ngFor="let metadatum of (metadata | async)"> <tbody>
<tr *ngFor="let metadatum of (metadataObs | async)">
<td>{{metadatum.key}}</td> <td>{{metadatum.key}}</td>
<td>{{metadatum.value}}</td> <td>{{metadatum.value}}</td>
<td>{{metadatum.language}}</td> <td>{{metadatum.language}}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<ds-item-page-full-file-section [item]="itemPayload"></ds-item-page-full-file-section> <ds-item-page-full-file-section [item]="item"></ds-item-page-full-file-section>
<ds-item-page-collections [item]="itemPayload"></ds-item-page-collections> <ds-item-page-collections [item]="item"></ds-item-page-collections>
</div>
</div> </div>
</div> <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.item' | translate}}"></ds-error>
<ds-error *ngIf="(item | async)?.hasFailed" message="{{'error.item' | translate}}"></ds-error> <ds-loading *ngIf="itemRD?.isLoading" message="{{'loading.item' | translate}}"></ds-loading>
<ds-loading *ngIf="(item | async)?.isLoading" message="{{'loading.item' | translate}}"></ds-loading> </ng-container>

6
src/app/+item-page/full/full-item-page.component.ts
View File

@@ -30,9 +30,9 @@ import { hasValue } from '../../shared/empty.util';
}) })
export class FullItemPageComponent extends ItemPageComponent implements OnInit { export class FullItemPageComponent extends ItemPageComponent implements OnInit {
item: Observable<RemoteData<Item>>; itemRDObs: Observable<RemoteData<Item>>;
metadata: Observable<Metadatum[]>; metadataObs: Observable<Metadatum[]>;
constructor(route: ActivatedRoute, items: ItemDataService, metadataService: MetadataService) { constructor(route: ActivatedRoute, items: ItemDataService, metadataService: MetadataService) {
super(route, items, metadataService); super(route, items, metadataService);
@@ -45,7 +45,7 @@ export class FullItemPageComponent extends ItemPageComponent implements OnInit {
initialize(params) { initialize(params) {
super.initialize(params); super.initialize(params);
this.metadata = this.item this.metadataObs = this.itemRDObs
.map((rd: RemoteData<Item>) => rd.payload) .map((rd: RemoteData<Item>) => rd.payload)
.filter((item: Item) => hasValue(item)) .filter((item: Item) => hasValue(item))
.map((item: Item) => item.metadata); .map((item: Item) => item.metadata);

16
src/app/+item-page/simple/field-components/file-section/file-section.component.html
View File

@@ -1,9 +1,11 @@
<ds-metadata-field-wrapper *ngIf="(files | async)?.length > 0" [label]="label | translate"> <ng-container *ngVar="(bitstreamsObs | async) as bitstreams">
<ds-metadata-field-wrapper *ngIf="bitstreams?.length > 0" [label]="label | translate">
<div class="file-section"> <div class="file-section">
<a *ngFor="let file of (files | async); let last=last;" [href]="file?.content" [download]="file?.name"> <a *ngFor="let file of bitstreams; let last=last;" [href]="file?.content" [download]="file?.name">
<span>{{file?.name}}</span> <span>{{file?.name}}</span>
<span>({{(file?.sizeBytes) | dsFileSize }})</span> <span>({{(file?.sizeBytes) | dsFileSize }})</span>
<span *ngIf="!last" innerHTML="{{separator}}"></span> <span *ngIf="!last" innerHTML="{{separator}}"></span>
</a> </a>
</div> </div>
</ds-metadata-field-wrapper> </ds-metadata-field-wrapper>
</ng-container>

4
src/app/+item-page/simple/field-components/file-section/file-section.component.ts
View File

@@ -20,14 +20,14 @@ export class FileSectionComponent implements OnInit {
separator = '<br/>'; separator = '<br/>';
files: Observable<Bitstream[]>; bitstreamsObs: Observable<Bitstream[]>;
ngOnInit(): void { ngOnInit(): void {
this.initialize(); this.initialize();
} }
initialize(): void { initialize(): void {
this.files = this.item.getFiles(); this.bitstreamsObs = this.item.getFiles();
} }
} }

48
src/app/+item-page/simple/item-page.component.html
View File

@@ -1,27 +1,29 @@
<div class="item-page" *ngIf="(item | async)?.hasSucceeded" @fadeInOut> <ng-container *ngVar="(itemRDObs | async) as itemRD">
<div *ngIf="(item | async)?.payload; let itemPayload"> <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
<ds-item-page-title-field [item]="itemPayload"></ds-item-page-title-field> <div *ngIf="itemRD?.payload as item">
<div class="row"> <ds-item-page-title-field [item]="item"></ds-item-page-title-field>
<div class="col-xs-12 col-md-4"> <div class="row">
<ds-metadata-field-wrapper> <div class="col-xs-12 col-md-4">
<ds-thumbnail [thumbnail]="thumbnail | async"></ds-thumbnail> <ds-metadata-field-wrapper>
</ds-metadata-field-wrapper> <ds-thumbnail [thumbnail]="thumbnailObs | async"></ds-thumbnail>
<ds-item-page-file-section [item]="itemPayload"></ds-item-page-file-section> </ds-metadata-field-wrapper>
<ds-item-page-date-field [item]="itemPayload"></ds-item-page-date-field> <ds-item-page-file-section [item]="item"></ds-item-page-file-section>
<ds-item-page-author-field [item]="itemPayload"></ds-item-page-author-field> <ds-item-page-date-field [item]="item"></ds-item-page-date-field>
</div> <ds-item-page-author-field [item]="item"></ds-item-page-author-field>
<div class="col-xs-12 col-md-6"> </div>
<ds-item-page-abstract-field [item]="itemPayload"></ds-item-page-abstract-field> <div class="col-xs-12 col-md-6">
<ds-item-page-uri-field [item]="itemPayload"></ds-item-page-uri-field> <ds-item-page-abstract-field [item]="item"></ds-item-page-abstract-field>
<ds-item-page-collections [item]="itemPayload"></ds-item-page-collections> <ds-item-page-uri-field [item]="item"></ds-item-page-uri-field>
<div> <ds-item-page-collections [item]="item"></ds-item-page-collections>
<a class="btn btn-outline-primary" [routerLink]="['/items/' + itemPayload.id + '/full']"> <div>
{{"item.page.link.full" | translate}} <a class="btn btn-outline-primary" [routerLink]="['/items/' + item.id + '/full']">
</a> {{"item.page.link.full" | translate}}
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.item' | translate}}"></ds-error>
<ds-error *ngIf="(item | async)?.hasFailed" message="{{'error.item' | translate}}"></ds-error> <ds-loading *ngIf="itemRD?.isLoading" message="{{'loading.item' | translate}}"></ds-loading>
<ds-loading *ngIf="(item | async)?.isLoading" message="{{'loading.item' | translate}}"></ds-loading> </ng-container>

10
src/app/+item-page/simple/item-page.component.ts
View File

@@ -31,9 +31,9 @@ export class ItemPageComponent implements OnInit {
private sub: any; private sub: any;
item: Observable<RemoteData<Item>>; itemRDObs: Observable<RemoteData<Item>>;
thumbnail: Observable<Bitstream>; thumbnailObs: Observable<Bitstream>;
constructor( constructor(
private route: ActivatedRoute, private route: ActivatedRoute,
@@ -51,9 +51,9 @@ export class ItemPageComponent implements OnInit {
initialize(params) { initialize(params) {
this.id = +params.id; this.id = +params.id;
this.item = this.items.findById(params.id); this.itemRDObs = this.items.findById(params.id);
this.metadataService.processRemoteData(this.item); this.metadataService.processRemoteData(this.itemRDObs);
this.thumbnail = this.item this.thumbnailObs = this.itemRDObs
.map((rd: RemoteData<Item>) => rd.payload) .map((rd: RemoteData<Item>) => rd.payload)
.filter((item: Item) => hasValue(item)) .filter((item: Item) => hasValue(item))
.flatMap((item: Item) => item.getThumbnail()); .flatMap((item: Item) => item.getThumbnail());

6
src/app/+search-page/search-page.component.html
View File

@@ -1,10 +1,10 @@
<div class="search-page"> <div class="search-page">
<ds-search-form <ds-search-form
[query]="query" [query]="query"
[scope]="(scopeObject | async)?.payload" [scope]="(scopeObjectRDObs | async)?.payload"
[currentParams]="currentParams" [currentParams]="currentParams"
[scopes]="(scopeList | async)?.payload"> [scopes]="(scopeListRDObs | async)?.payload">
</ds-search-form> </ds-search-form>
<ds-view-mode-switch></ds-view-mode-switch> <ds-view-mode-switch></ds-view-mode-switch>
<ds-search-results [searchResults]="results | async" [searchConfig]="searchOptions"></ds-search-results> <ds-search-results [searchResults]="resultsRDObs | async" [searchConfig]="searchOptions"></ds-search-results>
</div> </div>

2
src/app/+search-page/search-page.component.spec.ts
View File

@@ -103,7 +103,7 @@ describe('SearchPageComponent', () => {
(comp as any).updateSearchResults({}); (comp as any).updateSearchResults({});
expect(comp.results as any).toBe(mockResults); expect(comp.resultsRDObs as any).toBe(mockResults);
}); });
}); });

14
src/app/+search-page/search-page.component.ts
View File

@@ -31,18 +31,18 @@ export class SearchPageComponent implements OnInit, OnDestroy {
private scope: string; private scope: string;
query: string; query: string;
scopeObject: Observable<RemoteData<DSpaceObject>>; scopeObjectRDObs: Observable<RemoteData<DSpaceObject>>;
results: Observable<RemoteData<Array<SearchResult<DSpaceObject>>>>; resultsRDObs: Observable<RemoteData<Array<SearchResult<DSpaceObject>>>>;
currentParams = {}; currentParams = {};
searchOptions: SearchOptions; searchOptions: SearchOptions;
scopeList: Observable<RemoteData<Community[]>>; scopeListRDObs: Observable<RemoteData<Community[]>>;
constructor( constructor(
private service: SearchService, private service: SearchService,
private route: ActivatedRoute, private route: ActivatedRoute,
private communityService: CommunityDataService private communityService: CommunityDataService
) { ) {
this.scopeList = communityService.findAll(); this.scopeListRDObs = communityService.findAll();
// Initial pagination config // Initial pagination config
const pagination: PaginationComponentOptions = new PaginationComponentOptions(); const pagination: PaginationComponentOptions = new PaginationComponentOptions();
pagination.id = 'search-results-pagination'; pagination.id = 'search-results-pagination';
@@ -76,9 +76,9 @@ export class SearchPageComponent implements OnInit, OnDestroy {
sort: sort sort: sort
}); });
if (isNotEmpty(this.scope)) { if (isNotEmpty(this.scope)) {
this.scopeObject = this.communityService.findById(this.scope); this.scopeObjectRDObs = this.communityService.findById(this.scope);
} else { } else {
this.scopeObject = Observable.of(undefined); this.scopeObjectRDObs = Observable.of(undefined);
} }
} }
); );
@@ -86,7 +86,7 @@ export class SearchPageComponent implements OnInit, OnDestroy {
private updateSearchResults(searchOptions) { private updateSearchResults(searchOptions) {
// Resolve search results // Resolve search results
this.results = this.service.search(this.query, this.scope, searchOptions); this.resultsRDObs = this.service.search(this.query, this.scope, searchOptions);
} }
ngOnDestroy() { ngOnDestroy() {

9
src/app/shared/shared.module.ts
View File

@@ -30,6 +30,7 @@ import { SearchResultListElementComponent } from '../object-list/search-result-l
import { SearchFormComponent } from './search-form/search-form.component'; import { SearchFormComponent } from './search-form/search-form.component';
import { WrapperListElementComponent } from '../object-list/wrapper-list-element/wrapper-list-element.component'; import { WrapperListElementComponent } from '../object-list/wrapper-list-element/wrapper-list-element.component';
import { ViewModeSwitchComponent } from './view-mode-switch/view-mode-switch.component'; import { ViewModeSwitchComponent } from './view-mode-switch/view-mode-switch.component';
import { VarDirective } from './utils/var.directive';
const MODULES = [ const MODULES = [
// Do NOT include UniversalModule, HttpModule, or JsonpModule here // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -74,6 +75,10 @@ const ENTRY_COMPONENTS = [
SearchResultListElementComponent SearchResultListElementComponent
]; ];
const DIRECTIVES = [
VarDirective
];
@NgModule({ @NgModule({
imports: [ imports: [
...MODULES ...MODULES
@@ -81,12 +86,14 @@ const ENTRY_COMPONENTS = [
declarations: [ declarations: [
...PIPES, ...PIPES,
...COMPONENTS, ...COMPONENTS,
...DIRECTIVES,
...ENTRY_COMPONENTS ...ENTRY_COMPONENTS
], ],
exports: [ exports: [
...MODULES, ...MODULES,
...PIPES, ...PIPES,
...COMPONENTS ...COMPONENTS,
...DIRECTIVES
], ],
entryComponents: [ entryComponents: [
...ENTRY_COMPONENTS ...ENTRY_COMPONENTS

23
src/app/shared/utils/var.directive.ts Normal file
View File

@@ -0,0 +1,23 @@
import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core';
/* tslint:disable:directive-selector */
@Directive({
selector: '[ngVar]',
})
export class VarDirective {
@Input()
set ngVar(context: any) {
this.context.$implicit = this.context.ngVar = context;
this.updateView();
}
context: any = {};
constructor(private vcRef: ViewContainerRef, private templateRef: TemplateRef<any>) {}
updateView() {
this.vcRef.clear();
this.vcRef.createEmbeddedView(this.templateRef, this.context);
}
}
/* tslint:enable:directive-selector */

2
src/modules/app/browser-app.module.ts
View File

@@ -40,7 +40,7 @@ export function createTranslateLoader(http: HttpClient) {
// forRoot ensures the providers are only created once // forRoot ensures the providers are only created once
IdlePreloadModule.forRoot(), IdlePreloadModule.forRoot(),
RouterModule.forRoot([], { RouterModule.forRoot([], {
// enableTracing: true, enableTracing: true,
useHash: false, useHash: false,
preloadingStrategy: preloadingStrategy:
IdlePreload IdlePreload