41650: finished full item page

This commit is contained in:
Lotte Hofstede
2017-05-30 11:21:17 +02:00
parent 563a8ca66b
commit fa9cd9b1ea
10 changed files with 132 additions and 58 deletions

View File

@@ -12,8 +12,14 @@
"date": "Date",
"uri": "URI",
"files": "Files",
"downloads": "Downloads",
"collections": "Collections"
"collections": "Collections",
"filesection": {
"download": "Download",
"name": "Name:",
"format": "Format:",
"size": "Size:",
"description": "Description:"
}
}
},

View File

@@ -21,8 +21,14 @@ export class NormalizedBitstream extends NormalizedDSpaceObject {
/**
* The mime type of this Bitstream
*/
@autoserialize
mimetype: string;
/**
* The format of this Bitstream
*/
format: string;
/**
* The description of this Bitstream
*/

View File

@@ -47,50 +47,40 @@ export class Item extends DSpaceObject {
*/
getThumbnail(): Observable<Bitstream> {
const bundle: Observable<Bundle> = this.getBundle("THUMBNAIL");
return bundle.flatMap(
bundle => {
if (bundle != null) {
return bundle.primaryBitstream.payload;
}
else {
return Observable.of(undefined);
}
}
);
return bundle
.filter(bundle => hasValue(bundle))
.flatMap(bundle => bundle.primaryBitstream.payload)
.startWith(undefined);
}
/**
* Retrieves the thumbnail for the given original of this item
* @returns {Observable<Bitstream>} the primaryBitstream of the "THUMBNAIL" bundle
*/
getThumbnailForOriginal(original: Observable<Bitstream>): Observable<Bitstream> { //returns obs of obs of bitstream instead...
getThumbnailForOriginal(original: Bitstream): Observable<Bitstream> { //returns obs of obs of bitstream instead...
const bundle: Observable<Bundle> = this.getBundle("THUMBNAIL");
return bundle.map(
bundle => {
if (bundle != null) {
return bundle.bitstreams.find(
file => {
return Observable.combineLatest(
original,
file.payload,
(original, thumbnail) => {
return (thumbnail.name.startsWith(original.name));
});
});
}
}
);
return bundle
.filter(bundle => hasValue(bundle))
.flatMap(bundle => bundle
.bitstreams.payload.map(files => files
.find(thumbnail => thumbnail
.name.startsWith(original.name)
)
)
)
.startWith(undefined);;
}
/**
* Retrieves all files that should be displayed on the item page of this item
* @returns {Observable<Array<Observable<Bitstream>>>} an array of all Bitstreams in the "ORIGINAL" bundle
*/
getFiles(): Observable<Bitstream[]> {
const bundle: Observable <Bundle> = this.getBundle("ORIGINAL");
getFiles(name: String = "ORIGINAL"): Observable<Bitstream[]> {
const bundle: Observable <Bundle> = this.getBundle(name);
return bundle
.filter(bundle => hasValue(bundle))
.flatMap(bundle => bundle.bitstreams.payload);
.flatMap(bundle => bundle.bitstreams.payload)
.startWith([]);
}
/**
@@ -105,7 +95,8 @@ export class Item extends DSpaceObject {
return bundles.find((bundle: Bundle) => {
return bundle.name === name
});
});
})
.startWith(undefined);
}
}

View File

@@ -1,11 +1,29 @@
<ds-metadata-field-wrapper [label]="label | translate">
<div class="file-section row" *ngFor="let file of (files | async); let last=last;">
<ds-thumbnail [thumbnail]="thumbnails[(file | async)?.id] | async"></ds-thumbnail>
<div>{{(file | async)?.name}}</div>
<div>{{(file | async)?.findMetadata("dc.description")}}</div>
<div>{{((file | async)?.size) | dsFileSize }}</div>
<a [href]="(file | async)?.retrieve">
{{"item.page.download" | translate}}
<div class="col-3">
<ds-thumbnail [thumbnail]="thumbnails.get(file.id) | async"></ds-thumbnail>
</div>
<div class="col-7">
<dl class="row">
<dt class="col-md-4">{{"item.page.filesection.name" | translate}}</dt>
<dd class="col-md-8">{{file.name}}</dd>
<dt class="col-md-4">{{"item.page.filesection.size" | translate}}</dt>
<dd class="col-md-8">{{(file.size) | dsFileSize }}</dd>
<dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt>
<dd class="col-md-8">{{(file.mimetype)}}</dd>
<dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt>
<dd class="col-md-8">{{file.findMetadata("dc.description")}}</dd>
</dl>
</div>
<div class="col-2">
<a [href]="file.retrieve">
{{"item.page.filesection.download" | translate}}
</a>
</div>
</div>
</ds-metadata-field-wrapper>

View File

@@ -0,0 +1,7 @@
@import '../../../../../styles/variables.scss';
@import '../../../../../../node_modules/bootstrap/scss/_variables.scss';
@media screen and (min-width: map-get($grid-breakpoints, md)) {
dt {
text-align: right;
}
}

View File

@@ -3,6 +3,7 @@ import { Bitstream } from "../../../../core/shared/bitstream.model";
import { Item } from "../../../../core/shared/item.model";
import { Observable } from "rxjs";
import { FileSectionComponent } from "../../../simple/field-components/file-section/file-section.component";
import { hasValue } from "../../../../shared/empty.util";
/**
* This component renders the file section of the item
@@ -11,13 +12,17 @@ import { FileSectionComponent } from "../../../simple/field-components/file-sect
@Component({
selector: 'ds-item-page-full-file-section',
styleUrls: ['./full-file-section.component.css'],
templateUrl: './full-file-section.component.html'
})
export class FullFileSectionComponent extends FileSectionComponent implements OnInit {
export class FullFileSectionComponent extends FileSectionComponent {
@Input() item: Item;
files: Observable<Array<Observable<Bitstream>>>;
label : string;
files: Observable<Bitstream[]>;
thumbnails: Map<string, Observable<Bitstream>> = new Map();
@@ -25,21 +30,18 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
universalInit() {
}
ngOnInit(): void {
super.ngOnInit();
initialize(): void {
const originals = this.item.getFiles("ORIGINAL");
const licenses = this.item.getFiles("LICENSE");
licenses.subscribe(licenses => console.log(licenses));
this.files = Observable.combineLatest(originals, licenses, (originals, licenses) => [...originals, ...licenses]);
this.files.subscribe(
files =>
files.forEach(
file => {
file.subscribe(
original => {
const thumbnail : Observable<Bitstream> = this.item.getThumbnailForOriginal(file);
thumbnail.subscribe(t =>
console.log("TESTTTT" , t));
const thumbnail: Observable<Bitstream> = this.item.getThumbnailForOriginal(original);
this.thumbnails.set(original.id, thumbnail);
}
);
}
)
)
}

View File

@@ -24,15 +24,17 @@ export class FileSectionComponent implements OnInit {
constructor() {
this.universalInit();
}
universalInit() {
}
ngOnInit(): void {
this.initialize();
}
initialize(): void {
this.files = this.item.getFiles();
}
}

View File

@@ -42,5 +42,26 @@ export const BITSTREAMS = [
],
"format": "JPEG",
"mimetype": "image/jpeg"
},
{
"_links": {
"self": { "href": "/bitstreams/8934" },
"bundle": { "href": "/bundles/99f78e5e-3677-43b0-aaef-cddaa1a49092" },
"retrieve": { "href": "/rest/bitstreams/ba7d24f2-8fc7-4b8e-b7b6-6c32be1c12a6/retrieve" }
},
"id": "8934",
"uuid": "ba7d24f2-8fc7-4b8e-b7b6-6c32be1c12a6",
"name": "license.txt",
"size": 41183,
"checksum": {
"value": "8ad416e8a39e645020e13e06f1427814",
"algorithm": "MD5"
},
"metadata": [
{ "key": "dc.title", "value": "license.txt", "language": null },
{ "key": "dc.description", "value": "License", "language": "en" }
],
"format": "Text",
"mimetype": "text/plain"
}
];

View File

@@ -36,5 +36,23 @@ export const BUNDLES = [
"metadata": [
{ "key": "dc.title", "value": "THUMBNAIL", "language": "en" }
]
},
{
"_links": {
"self": { "href": "/bundles/8475" },
"items": [
{ "href": "/items/8871" }
],
"bitstreams": [
{ "href": "/bitstreams/8934" },
],
"primaryBitstream": { "href": "/bitstreams/8934" }
},
"id": "8475",
"uuid": "99f78e5e-3677-43b0-aaef-cddaa1a49092",
"name": "LICENSE",
"metadata": [
{ "key": "dc.title", "value": "LICENSE", "language": "en" }
]
}
];

View File

@@ -18,6 +18,9 @@ export const ITEMS = [
},
{
"href": "/bundles/5687"
},
{
"href": "/bundles/8475"
}
]
},
@@ -109,9 +112,9 @@ export const ITEMS = [
{
"href": "/bundles/2355"
},
// {
// "href": "/bundles/5687"
// }
{
"href": "/bundles/5687"
}
]
},
"id": "9978",