[Library | Trunk]: Merge search results from branch.

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@58241 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2020-03-12 13:49:10 +00:00
parent 4059e6fa32
commit 91a6a82977
20 changed files with 808 additions and 329 deletions

View File

@ -1,6 +1,6 @@
import {Component, Input, OnInit} from "@angular/core";
import {StringUtils} from "../../../utils/string-utils.class";
import {Organization, Project} from "../../../utils/entities/searchResult";
import {Organization, Project} from "../../../utils/result-preview/result-preview";
export interface Keyword {
field: string,

View File

@ -0,0 +1,69 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import {SearchResult} from "../../../utils/entities/searchResult";
import {ErrorCodes} from "../../../utils/properties/errorCodes";
import {RouterHelper} from "../../../utils/routerHelper.class";
import {ResultPreview} from "../../../utils/result-preview/result-preview";
import {AlertModal} from "../../../utils/modal/alert";
import {EnvProperties} from "../../../utils/properties/env-properties";
@Component({
selector: 'modal-result',
template: `
<errorMessages [status]="[status]" [type]="type" tab_error_class=true></errorMessages>
<div *ngIf="status == errorCodes.DONE">
<no-load-paging *ngIf="totalResults > pageSize" [type]="type"
(pageChange)="update($event)"
[page]="page" [pageSize]="pageSize"
[totalResults]="totalResults">
</no-load-paging>
<ul class="uk-list uk-list-divider uk-margin">
<li *ngFor="let result of results">
<result-preview [modal]="modal" [properties]="properties"
[result]="getResultPreview(result)"
[showSubjects]="showSubjects"
[showOrganizations]="showOrganizations"></result-preview>
</li>
</ul>
<no-load-paging *ngIf="totalResults > pageSize" [type]="type"
(pageChange)="update($event)"
[page]="page" [pageSize]="pageSize"
[totalResults]="totalResults">
</no-load-paging>
</div>
`
})
export class ModalResultComponent {
@Input() results: SearchResult[];
@Input() totalResults: number = 0;
@Input() type: string;
@Input() resultType: string;
@Input() showOrganizations: boolean = true;
@Input() showSubjects: boolean = false;
@Input() modal: AlertModal;
@Input() properties: EnvProperties;
@Input() status: number;
@Input() pageSize: number = 1;
@Output() updatePage: EventEmitter<any> = new EventEmitter<any>();
public page: number = 1;
public errorCodes: ErrorCodes = new ErrorCodes();
public routerHelper: RouterHelper = new RouterHelper();
public errorMessage: string = "No results found";
constructor() {
}
ngOnInit() {
}
public getResultPreview(result: SearchResult): ResultPreview {
return ResultPreview.searchResultConvert(result, this.resultType);
}
public update(event) {
this.page = event.value;
this.updatePage.emit({
value: event.value
});
}
}

View File

@ -0,0 +1,23 @@
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {FormsModule} from '@angular/forms';
import {ModalResultComponent} from './modal-result.component';
import {RouterModule} from '@angular/router';
import {ErrorMessagesModule} from "../../../utils/errorMessages.module";
import {ResultPreviewModule} from "../../../utils/result-preview/result-preview.module";
import {NoLoadPaging} from "../no-load-paging.module";
@NgModule({
imports: [
CommonModule, FormsModule,
RouterModule, ErrorMessagesModule, ResultPreviewModule, NoLoadPaging
],
declarations: [
ModalResultComponent,
],
exports: [
ModalResultComponent
]
})
export class ModalResultModule {
}

View File

@ -0,0 +1,40 @@
import {Component, Input, Output, EventEmitter} from '@angular/core';
import {Observable} from 'rxjs';
import {ErrorCodes} from '../../utils/properties/errorCodes';
@Component({
selector: 'no-load-paging',
template: `
<div class="paging-hr searchPaging uk-margin-small-bottom">
<div class="uk-panel uk-margin-small-top uk-grid uk-flex uk-flex-middle">
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase" *ngIf="type && totalResults">
{{totalResults | number}}
<span class="uk-text-muted uk-text-uppercase"> {{type}}, page </span>
{{page}}
<span class="uk-text-muted uk-text-uppercase"> of </span>
{{paging.getTotalPages()}}
</div>
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand">
<paging-no-load #paging [currentPage]="page"
customClasses="uk-margin-remove-bottom"
[totalResults]="totalResults" [size]="pageSize"
(pageChange)="updatePage($event)">
</paging-no-load>
</div>
</div>
</div>
`
})
export class NoLoadPagingComponent {
@Input() type: string;
@Input() page: number = 1;
@Input() pageSize: number = 10;
@Input() totalResults: number;
@Output() pageChange: EventEmitter<any> = new EventEmitter<any>();
public updatePage(event) {
this.pageChange.emit({
value: event.value
});
}
}

View File

@ -0,0 +1,19 @@
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {FormsModule} from '@angular/forms';
import {PagingModule} from '../../utils/paging.module';
import {NoLoadPagingComponent} from "./no-load-paging.component";
@NgModule({
imports: [
CommonModule, FormsModule, PagingModule
],
declarations: [
NoLoadPagingComponent
],
exports: [
NoLoadPagingComponent
]
})
export class NoLoadPaging {
}

View File

@ -20,7 +20,7 @@ import {ConfigurationService} from "../../utils/configuration/configuration.serv
<span *ngIf="showPublications" class="uk-margin-small-left"> <input type="checkbox" id="publ" name="Publications" formControlName="publication" (change)="changed()"> Publications </span>
<span *ngIf="showDatasets" class="uk-margin-small-left"> <input type="checkbox" formControlName="dataset" (change)="changed()"> Research data </span>
<span *ngIf="showSoftware" class="uk-margin-small-left"> <input type="checkbox" formControlName="software" (change)="changed()"> Software </span>
<span *ngIf="showOrp" class="uk-margin-small-left"> <input type="checkbox" formControlName="other" (change)="changed()"> Other research outcomes </span>
<span *ngIf="showOrp" class="uk-margin-small-left"> <input type="checkbox" formControlName="other" (change)="changed()"> Other research products </span>
</span>
</div>
</form>

View File

@ -30,10 +30,10 @@ import {ErrorCodes} from '../../utils/properties/errorCodes';
<div class="uk-width-1-1@s uk-width-1-2@m" *ngIf="!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING">
{{oldTotalResults|number}} {{type}}, page {{searchUtils.page | number}} of {{(totalPages(oldTotalResults)|number)}}
</div-->
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m" *ngIf="results && searchUtils.totalResults > searchUtils.size">
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand" *ngIf="results && searchUtils.totalResults > searchUtils.size">
<paging [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [baseUrl]="baseUrl" [size]="searchUtils.size" [parameterNames] = "parameterNames" [parameterValues] = "parameterValues" > </paging>
</div>
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m" *ngIf="!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING">
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand" *ngIf="!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING">
<paging [currentPage]="searchUtils.page" [totalResults]="oldTotalResults" [baseUrl]="baseUrl" [size]="searchUtils.size" [parameterNames] = "parameterNames" [parameterValues] = "parameterValues" > </paging>
</div>
</div>

View File

@ -11,13 +11,10 @@ import{PagingModule} from '../../utils/paging.module';
],
declarations: [
SearchPagingComponent
],
providers:[
],
exports: [
SearchPagingComponent
]
})
export class SearchPagingModule { }
export class SearchPagingModule {
}

View File

@ -2,199 +2,9 @@
<errorMessages [status]="[status]" [type]="'results'"></errorMessages>
<li *ngFor="let result of results" class="uk-animation-fade">
<div class="uk-card uk-card-default uk-padding uk-card-hover">
<!-- Before title -->
<div class="uk-text-small">
<span class="uk-text-capitalize">
{{(result.entityType) ? getTypeName(result.entityType) : getTypeName(type)}}
</span>
<span *ngIf="result.type" class="uk-text-capitalize"> . {{result.type}}</span>
<span *ngIf="properties.environment !== 'production' && result.types &&
removeDuplicates(result.types, (result.entityType) ? getTypeName(result.entityType) : getTypeName(type)).length > 0">
{{' . '}}<highlight [field]="'type'" [keywords]="keywords" [element]="(removeDuplicates(result.types, (result.entityType) ?
getTypeName(result.entityType) : getTypeName(type)).join(' . '))"></highlight>
</span>
<span *ngIf="properties.environment === 'production' && result.types &&
removeUnknown(result.types, (result.entityType) ? getTypeName(result.entityType) : getTypeName(type)).length > 0">
{{' . '}}<highlight [field]="'type'" [keywords]="keywords"
[element]="(removeUnknown(result.types, (result.entityType) ?
getTypeName(result.entityType) : getTypeName(type)).join(' . '))"></highlight>
</span>
<span *ngIf="result.year">{{' . ' + result.year.toString()}}</span>
<span *ngIf="result.startYear && result.endYear"> . {{result.startYear}} - {{result.endYear}}</span>
<span *ngIf="result.embargoEndDate && result.embargoEndDate != ''">
. Embargo End Date: {{result.embargoEndDate | date: 'dd MMM yyyy'}}
</span>
</div>
<!-- Title -->
<div class="uk-h5 uk-margin-remove">
<a [queryParams]="routerHelper.createQueryParam((result.entityType)?queryParamName(result.entityType):urlParam,result.id)"
routerLink="/search/{{(result.entityType)?result.entityType:type}}" class="portal-link">
<div *ngIf="(result.title && result.title.name) || result.acronym">
<span *ngIf="result.acronym">
<highlight [field]="'acronym'" [keywords]="keywords" [element]="result.acronym"></highlight>
</span>
<span *ngIf="result.acronym && (result.title && result.title.name)"> (</span>
<span *ngIf="(result.title && result.title.name)">
<highlight [field]="'title'" [keywords]="keywords" [element]="result.title.name" [html]="true"></highlight>
</span>
<span *ngIf="result.acronym && (result.title && result.title.name)">)</span>
</div>
<div *ngIf="!(result.title && result.title.name) && !result.acronym">
[no title available]
</div>
</a>
</div>
<!-- Authors -->
<div *ngIf="result.authors" class="uk-margin-small-bottom">
<showAuthors [keywords]="keywords" [authors]="result.authors" [authorsLimit]=10 [showAll]=false></showAuthors>
</div>
<!-- Funder -->
<div *ngIf="result.funderShortname || result.code" class="uk-margin-small-bottom uk-text-small">
<span *ngIf="result.funderShortname">
<span class="uk-text-muted">Funder: </span>
<highlight [field]="'funder'" [keywords]="keywords" [element]="result.funderShortname"></highlight>
</span>
<span *ngIf="result.code" [class.uk-margin-left]="result.funderShortname">
<span class="uk-text-muted">Project Code: </span>
<highlight [field]="'code'" [keywords]="keywords" [element]="result.code.toString()"></highlight>
</span>
</div>
<!-- Labels -->
<div class="uk-margin-small-bottom">
<span *ngIf="properties.environment !== 'production' && result.title && result.title.accessMode"
class="uk-label custom-label" [ngClass]="'label-' + accessClass(result.title.accessMode)"
title="Access Mode">
{{result.title.accessMode}}
</span>{{' '}}
<span *ngIf="properties.environment === 'production' && result.title &&
result.title.accessMode && result.title.accessMode.toLowerCase() !== 'not available'"
class="uk-label custom-label" [ngClass]="'label-' + accessClass(result.title.accessMode)"
title="Access Mode">
{{result.title.accessMode}}
</span>{{' '}}
<span *ngIf="result.openAccessMandatePublications && (!result.openAccessMandateDatasets)"
class="uk-label custom-label label-open"
title="Open Access mandate for Publications">
Open Access mandate for Publications
</span>{{' '}}
<span
*ngIf="result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets && (result.openAccessMandatePublications == undefined || !result.openAccessMandatePublications)"
class="uk-label custom-label label-open " title="Open Access mandate for Research Data">
Open Access mandate for Research Data
</span>{{' '}}
<span
*ngIf="result.openAccessMandatePublications != undefined && result.openAccessMandatePublications && result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets"
class="uk-label custom-label label-open "
title="Open Access mandate for Publications and Research Data">
Open Access mandate for Publications and Research Data
</span>{{' '}}
<span *ngIf="properties.environment !== 'production' && result.languages && result.languages.length > 0">
<span *ngFor="let language of result.languages" class="uk-label custom-label label-language "
title="Language">
<highlight [field]="'language'" [keywords]="keywords" [element]="language"></highlight>
</span>{{' '}}
</span>
<span
*ngIf="properties.environment === 'production' && result.languages && removeUnknown(result.languages).length > 0">
<span *ngFor="let language of removeUnknown(result.languages)" class="uk-label custom-label label-language "
title="Language">
<highlight [field]="'language'" [keywords]="keywords" [element]="language"></highlight>
</span>{{' '}}
</span>
<span *ngIf="result.title && result.title.sc39" class="uk-label custom-label label-sc39 "
title="Special Clause 39">Special Clause 39
</span>{{' '}}
<span *ngIf="result.compatibility && result.compatibility != ''"
class="uk-label custom-label label-compatibility"
title="Compatibility">
{{result.compatibility}}
</span>{{' '}}
</div>
<!-- Publisher -->
<div *ngIf="result.publisher && result.publisher != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Publisher: </span>
<highlight [field]="'publisher'" [keywords]="keywords" [element]="result.publisher"></highlight>
</div>
<!-- Country -->
<div *ngIf="result.countriesForResults && result.countriesForResults.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Country: </span>
<highlight [field]="'country'" [keywords]="keywords" [element]="result.countriesForResults.join(', ')"></highlight>
</div>
<div *ngIf="result.country && result.country != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Country: </span>
<highlight [field]="'country'" [keywords]="keywords" [element]="result.country"></highlight>
</div>
<div *ngIf="result.countries && result.countries.length > 0" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Country: </span><span
*ngFor="let country of result['countries'].slice(0,10) let i = index">
{{country}}{{(i < (result['countries'].slice(0, 10).length - 1)) ? ", " : ""}}
{{(i == result['countries'].slice(0, 10).length - 1 && result['countries'].length > 10) ? "..." : ""}}</span>
</div>
<!-- Programming Languages -->
<div *ngIf="result.programmingLanguages && result.programmingLanguages.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Programming language: </span>{{result.programmingLanguages.join(", ")}}
</div>
<!-- Projects -->
<div *ngIf="result.projects && result.projects.length > 0" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted"> Project: </span>
<span *ngFor="let project of result['projects'].slice(0,10) let i=index">
<span>
{{project['funderShortname'] ? project['funderShortname'] : project['funderName']}}
</span>
<span *ngIf="project.acronym || project.title">
| {{ project['acronym'] ? project['acronym'] : (project['title'].length > 25 ?
project['title'].substring(0, 25) + '...' : project['title'])}}
</span>
<span *ngIf="project.code"> ({{project.code}})</span>
<span *ngIf="i < result['projects'].length-1">,</span>
</span>
<span *ngIf="result['projects'].length > 10">...</span>
</div>
<!-- Organizations -->
<div *ngIf="showOrganizations && result['organizations'] && result['organizations'].length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Organization: </span>
<span *ngFor="let organization of result['organizations'].slice(0,10) let i=index">
<span>{{organization.name}}</span>
<span *ngIf="(i < result['organizations'].length-1) && (i < 9)">,</span>
</span>
<span *ngIf="result['organizations'].length > 10">...</span>
</div>
<!-- Website URL -->
<div *ngIf="result.websiteURL && result.websiteURL != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Website URL: </span>
<span>
<a href="{{result.websiteURL}}" target="_blank" class="custom-external custom-icon">
{{result.websiteURL}}
</a>
</span>
</div>
<!-- OAI-PMH URL-->
<div *ngIf="result.OAIPMHURL && result.OAIPMHURL != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">OAI-PMH URL: </span>
<span>
<a href="{{result.OAIPMHURL}}" target="_blank" class="custom-external custom-icon">
{{result.OAIPMHURL}}
</a>
</span>
</div>
<!-- Subjects -->
<div *ngIf="showSubjects && result.subjects && result.subjects.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Subject: </span>
<span *ngFor="let subject of result.subjects.slice(0,10) let i = index">{{subject}}
{{(i < (result.subjects.slice(0, 10).length - 1)) ? ", " : ""}}
{{(i == result.subjects.slice(0, 10).length - 1 && result.subjects.length > 10) ? "..." : ""}}
</span>
</div>
<!-- Description -->
<div *ngIf="result.description" class="uk-margin-small-bottom multi-line-ellipsis lines-3">
<p class="uk-text-small">
<highlight [field]="'description'" [keywords]="keywords" [element]="result.description"></highlight>
</p>
</div>
<result-preview [properties]="properties" [showOrganizations]="showOrganizations"
[showSubjects]="showSubjects" [result]="getResultPreview(result)">
</result-preview>
</div>
</li>
</ul>

View File

@ -4,13 +4,13 @@ import {ErrorCodes} from '../../utils/properties/errorCodes';
import {RouterHelper} from '../../utils/routerHelper.class';
import {EnvProperties} from '../../utils/properties/env-properties';
import {Keyword} from "./highlight/highlight.component";
import {ResultPreview} from "../../utils/result-preview/result-preview";
@Component({
selector: 'search-result',
templateUrl: 'searchResult.component.html'
})
export class SearchResultComponent implements OnInit {
@Input() keywords: Keyword[];
@Input() results: SearchResult[];
@Input() status: number;
@Input() type: string;
@ -19,77 +19,18 @@ export class SearchResultComponent implements OnInit {
@Input() showOrganizations: boolean = true;
@Input() custom_class: string = "search-results";
@Input() properties: EnvProperties;
public urlParam: string;
public errorCodes: ErrorCodes = new ErrorCodes();
public routerHelper: RouterHelper = new RouterHelper();
public errorMessage: string = "No results found";
constructor() {
}
ngOnInit() {
if (this.type == "project") {
this.urlParam = "projectId";
} else if (this.type == "organization") {
this.urlParam = "organizationId";
} else if (this.type == "dataprovider") {
this.urlParam = "datasourceId";
}
ngOnInit() {}
public getResultPreview(result: SearchResult): ResultPreview {
return ResultPreview.searchResultConvert(result, (result.entityType)?result.entityType:this.type);
}
/**
* Returns query param name base on result's entity type
*
* @param type
*/
public queryParamName(type: string): string {
if (type === "publication") {
return "articleId";
} else if (type === "dataset") {
return "datasetId";
} else if (type === "software") {
return "softwareId";
} else if (type === "other") {
return "orpId";
}
}
public getTypeName(type: string): string {
if (type === "dataset") {
return "research data";
} else if (type === "other") {
return "other research outcome";
} else if (type === "dataprovider") {
return "content provider";
} else {
return type;
}
}
public removeUnknown(array: string[], type: string = null): string[] {
if (type) {
return this.removeDuplicates(array, type).filter(value => value.toLowerCase() !== 'unknown');
} else {
return array.filter(value => value.toLowerCase() !== 'unknown');
}
}
public removeDuplicates(array: string[], type: string): string[] {
type = this.getTypeName(type);
return array.filter(value => value.toLowerCase() !== type);
}
public quote(params: string): string {
return '"' + params + '"';
}
public accessClass(accessMode: string): string {
if(accessMode.toLowerCase().indexOf('open') !== -1) {
return 'open';
} else if(accessMode.toLowerCase() === 'not available') {
return 'unknown';
} else {
return 'closed';
}
}
}

View File

@ -8,13 +8,14 @@ import {SearchResultComponent} from './searchResult.component';
import {ApprovedByCommunityModule} from '../../connect/approvedByCommunity/approved.module';
import {ShowAuthorsModule} from "../../utils/authors/showAuthors.module";
import {HighlightModule} from "./highlight/highlight.module";
import {ResultPreviewModule} from "../../utils/result-preview/result-preview.module";
@NgModule({
imports: [
CommonModule, FormsModule,
RouterModule, ErrorMessagesModule,
ApprovedByCommunityModule,
ShowAuthorsModule, HighlightModule
ShowAuthorsModule, HighlightModule, ResultPreviewModule
],
declarations: [
SearchResultComponent

View File

@ -1,6 +1,6 @@
import {Component, ElementRef, Input} from '@angular/core';
import {SafeHtmlPipe} from '../utils/pipes/safeHTML.pipe';
import {Component, Input} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
declare var loadAltmetrics:any;
//<altmetrics [id]="10.7717/peerj.1150" type="doi"></altmetrics>
@Component({
@ -36,6 +36,7 @@ export class AltMetricsComponent {
}
});
}
ngOnDestroy() {
this.sub.unsubscribe();
}

View File

@ -1,27 +1,4 @@
export class Project {
funderShortname: string;
funderName: string;
acronym: string;
title: string;
code: string;
id: string;
}
export class Author {
fullName: string;
orcid: string;
}
export class ResultTitle {
name: string;
accessMode: string;
sc39: string;
}
export class Organization {
id: string;
name: string;
}
import {Author, Organization, Project, ResultTitle} from "../result-preview/result-preview";
export class SearchResult {
title: ResultTitle;
@ -54,6 +31,9 @@ export class SearchResult {
acronym: string;
code: string;
funderShortname: string;
budget?: string;
contribution?: string;
currency?: string;
startYear: number;
endYear: number;
openAccessMandatePublications: boolean;

View File

@ -15,14 +15,10 @@ import {PagingFormatter} from './pagingFormatter.component';
declarations: [
pagingFormatterNoLoad,
PagingFormatter,
],
exports: [
pagingFormatterNoLoad,
PagingFormatter,
]
})
export class PagingModule {}

View File

@ -7,7 +7,8 @@ import{EnvProperties} from './properties/env-properties';
@Component({
selector: 'paging-no-load',
template: `
<ul disabled *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage && currentPage <= getTotalPages() ) " class="uk-pagination">
<ul disabled *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage && currentPage <= getTotalPages() ) " [ngClass]="customClasses"
class="uk-pagination uk-flex uk-flex-middle">
<li *ngIf=" currentPage > 1" ><a (click)="onPage((currentPage -1))" aria-label="Previous">
<span><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span></span></a></li>
@ -18,7 +19,8 @@ import{EnvProperties} from './properties/env-properties';
<li *ngIf=" currentPage +2 <= getTotalPages() "><a (click)="onPage((currentPage +2))">{{(currentPage +2) | number}}</a></li>
<li *ngIf=" (currentPage -2 <= 0)&&(currentPage +3 <= getTotalPages()) "><a (click)="onPage((currentPage +3))">{{(currentPage +3) | number}}</a></li>
<li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a (click)="onPage((currentPage +4))">{{(currentPage +4) | number}}</a></li>
<li *ngIf="getTotalPages() > currentPage"><a (click)="onPage(currentPage +1)" aria-label="Next">
<li *ngIf="getTotalPages() > currentPage">
<a (click)="onPage(currentPage +1)" aria-label="Next">
<span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
</span>
@ -33,6 +35,7 @@ import{EnvProperties} from './properties/env-properties';
export class pagingFormatterNoLoad {
@Input() public currentPage: number = 1;
@Input() public customClasses: string = '';
// @Input() public navigateTo: string;
@Input() public term: string='';
@Input() public size: number=10;

View File

@ -0,0 +1,257 @@
<!-- Before title -->
<div uk-grid>
<div [class.uk-width-1-1]="!result.relation" [class.uk-width-1-2]="result.relation"
[class.uk-width-3-4@s]="result.relation">
<div class="uk-text-small">
<span class="uk-text-capitalize">
{{getTypeName(result.resultType)}}
</span>
<span
*ngIf="properties.environment !== 'production' && result.types && removeDuplicates(result.types).length > 0">
{{' . ' + removeDuplicates(result.types).join(' . ')}}
</span>
<span *ngIf="properties.environment === 'production' && result.types &&
removeUnknown(removeDuplicates(result.types)).length > 0">
{{' . ' + removeDuplicates(removeDuplicates(result.types)).join(' . ')}}
</span>
<span *ngIf="result.year">{{' . ' + result.year.toString()}}</span>
<span *ngIf="result.startYear && result.endYear"> . {{result.startYear}} - {{result.endYear}}</span>
<span *ngIf="result.embargoEndDate && result.embargoEndDate != ''">
. Embargo End Date: {{result.embargoEndDate | date: 'dd MMM yyyy'}}
</span>
</div>
<!-- Title -->
<div class="uk-margin-small-bottom">
<div class="uk-h5 uk-margin-remove">
<a *ngIf="result.id" (click)="onTitleClick()" [queryParams]="routerHelper.createQueryParam(urlParam, result.id)"
routerLink="/search/{{result.resultType}}" class="portal-link">
<div *ngIf="(result.title) || result.acronym">
<span *ngIf="result.acronym">
{{result.acronym}}
</span>
<span *ngIf="result.acronym && (result.title)"> (</span>
<span *ngIf="result.title" [innerHTML]="result.title"></span>
<span *ngIf="result.acronym && result.title">)</span>
</div>
<div *ngIf="!result.title && !result.acronym">
[no title available]
</div>
</a>
<div *ngIf="!result.id">
<div *ngIf="(result.title) || result.acronym">
<span *ngIf="result.acronym">
{{result.acronym}}
</span>
<span *ngIf="result.acronym && (result.title)"> (</span>
<span *ngIf="result.title" [innerHTML]="result.title"></span>
<span *ngIf="result.acronym && result.title">)</span>
</div>
<div *ngIf="!result.title && !result.acronym">
[no title available]
</div>
</div>
</div>
<!-- Download from-->
<div *ngIf="result.hostedBy_collectedFrom && result.hostedBy_collectedFrom.length > 0"
class="uk-margin-small-bottom download-from">
<div *ngFor="let from of result.hostedBy_collectedFrom">
<span class="uk-margin-right uk-display-inline-block">
<span class="uk-text-muted">Download from: </span>
<a *ngIf="from.downloadUrl && from.downloadUrl.length === 1"
[href]="from.downloadUrl[0]" target="_blank" class="title">
{{from.downloadName}}
<span class="custom-external"></span>
</a>
<span *ngIf="!from.downloadUrl || from.downloadUrl.length === 0" class="title">
{{from.downloadName}}
</span>
</span>
<span class="provider uk-display-inline-block">
<span class="uk-text-muted">Provider: </span>
<a *ngIf="from.collectedId" routerLink="/search/dataprovider" [queryParams]="{datasourceId: from.collectedId}"
[href]="from.downloadUrl[0]" target="_blank">
{{from.collectedName}}
</a>
<span *ngIf="!from.collectedId">
{{from.collectedName}}
</span>
</span>
</div>
</div>
<!-- Authors -->
<div *ngIf="result.authors">
<showAuthors [authors]="result.authors" [authorsLimit]=10 [showAll]=false></showAuthors>
</div>
</div>
<!-- Funder -->
<div *ngIf="result.funderShortname || result.code" class="uk-margin-small-bottom uk-text-small">
<span *ngIf="result.funderShortname">
<span class="uk-text-muted">Funder: </span>
{{result.funderShortname}}
</span>
<span *ngIf="result.code" [class.uk-margin-left]="result.funderShortname">
<span class="uk-text-muted">Project Code: </span>
{{result.code}}
</span>
</div>
<!-- Funder Budget -->
<div *ngIf="result.budget || result.contribution" class="uk-margin-small-bottom uk-text-small">
<span *ngIf="result.budget">
<span class="uk-text-muted">Overall Budget: </span>
{{result.budget | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
<span *ngIf="result.contribution" [class.uk-margin-left]="result.budget">
<span class="uk-text-muted">Funder Contribution: </span>
{{result.contribution | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
</div>
<!-- Labels -->
<div class="uk-margin-small-bottom">
<span *ngIf="properties.environment !== 'production' && result.accessMode"
class="uk-label custom-label" [ngClass]="'label-' + accessClass(result.accessMode)"
title="Access Mode">
{{result.accessMode}}
</span>{{' '}}
<span
*ngIf="properties.environment === 'production' && result.accessMode && result.accessMode.toLowerCase() !== 'not available'"
class="uk-label custom-label" [ngClass]="'label-' + accessClass(result.accessMode)"
title="Access Mode">
{{result.accessMode}}
</span>{{' '}}
<span *ngIf="result.openAccessMandatePublications && (!result.openAccessMandateDatasets)"
class="uk-label custom-label label-open"
title="Open Access mandate for Publications">
Open Access mandate for Publications
</span>{{' '}}
<span
*ngIf="result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets && (result.openAccessMandatePublications == undefined || !result.openAccessMandatePublications)"
class="uk-label custom-label label-open " title="Open Access mandate for Research Data">
Open Access mandate for Research Data
</span>{{' '}}
<span
*ngIf="result.openAccessMandatePublications != undefined && result.openAccessMandatePublications && result.openAccessMandateDatasets != undefined && result.openAccessMandateDatasets"
class="uk-label custom-label label-open "
title="Open Access mandate for Publications and Research Data">
Open Access mandate for Publications and Research Data
</span>{{' '}}
<span *ngIf="properties.environment !== 'production' && result.languages && result.languages.length > 0">
<span *ngFor="let language of result.languages"
class="uk-label custom-label label-language " title="Language">
{{language}}
</span>{{' '}}
</span>
<span
*ngIf="properties.environment === 'production' && result.languages && removeUnknown(result.languages).length > 0">
<span *ngFor="let language of removeUnknown(result.languages)"
class="uk-label custom-label label-language " title="Language">
{{language}}
</span>{{' '}}
</span>
<span *ngIf="result.programmingLanguages && result.programmingLanguages.length > 0">
<span *ngFor="let programmingLanguage of result.programmingLanguages"
class="uk-label custom-label label-language" title="Programming Language">
{{programmingLanguage}}
</span>{{" "}}
</span>
<span *ngIf="result.sc39" class="uk-label custom-label label-sc39" title="Special Clause 39">
Special Clause 39
</span>{{' '}}
<span *ngIf="result.compatibility && result.compatibility != ''"
class="uk-label custom-label label-compatibility" title="Compatibility">
{{result.compatibility}}
</span>{{' '}}
</div>
<!-- Identifiers -->
<div *ngIf="result.identifiers && result.identifiers.size > 0">
<showIdentifiers [identifiers]="result.identifiers"></showIdentifiers>
</div>
<!-- Publisher -->
<div *ngIf="result.publisher && result.publisher != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Publisher: </span>
{{result.publisher}}
</div>
<!-- Countries -->
<div *ngIf="result.countries && result.countries.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">{{(result.countries.length == 1) ? 'Country' : 'Countries'}}: </span>
<span *ngFor="let country of result.countries.slice(0,10) let i = index">
{{country}}{{(i < (result.countries.slice(0, 10).length - 1)) ? ", " : ""}}
{{(i == result.countries.slice(0, 10).length - 1 && result.countries.length > 10) ? "..." : ""}}
</span>
</div>
<!-- Projects -->
<div *ngIf="result.projects && result.projects.length > 0" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted"> Project: </span>
<span *ngFor="let project of result.projects.slice(0,10) let i=index">
<span>
{{project.funderShortname ? project.funderShortname : project.funderName}}
</span>
<span *ngIf="project.acronym || project.title">
| {{ project.acronym ? project.acronym : (project.title.length > 25 ?
project.title.substring(0, 25) + '...' : project.title)}}
</span>
<span *ngIf="project.code"> ({{project.code}})</span>
<span *ngIf="i < result.projects.length-1">,</span>
</span>
<span *ngIf="result.projects.length > 10">...</span>
</div>
<!-- Organizations -->
<div *ngIf="showOrganizations && result.organizations && result.organizations.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Organization: </span>
<span *ngFor="let organization of result.organizations.slice(0,10) let i=index">
<span>{{organization.name}}</span>
<span *ngIf="(i < result.organizations.length-1) && (i < 9)">,</span>
</span>
<span *ngIf="result.organizations.length > 10">...</span>
</div>
<!-- Website URL -->
<div *ngIf="result.websiteURL && result.websiteURL != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Website URL: </span>
<span>
<a href="{{result.websiteURL}}" target="_blank" class="custom-external custom-icon">
{{result.websiteURL}}
</a>
</span>
</div>
<!-- OAI-PMH URL-->
<div *ngIf="result.OAIPMHURL && result.OAIPMHURL != ''" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">OAI-PMH URL: </span>
<span>
<a href="{{result.OAIPMHURL}}" target="_blank" class="custom-external custom-icon">
{{result.OAIPMHURL}}
</a>
</span>
</div>
<!-- Subjects -->
<div *ngIf="showSubjects && result.subjects && result.subjects.length > 0"
class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Subject: </span>
<span *ngFor="let subject of result.subjects.slice(0,10) let i = index">{{subject}}
{{(i < (result.subjects.slice(0, 10).length - 1)) ? ", " : ""}}
{{(i == result.subjects.slice(0, 10).length - 1 && result.subjects.length > 10) ? "..." : ""}}
</span>
</div>
</div>
<div *ngIf="result.relation" class="uk-width-expand uk-padding-remove-left uk-text-small">
<div *ngIf="result.percentage" class="uk-flex uk-flex-middle">
<div class="uk-margin-small-right">
<span class="uk-text-capitalize uk-text-muted">{{result.relation}}: </span>
<span class="portal-color uk-text-bold"> {{result.percentage}}%</span>
</div>
<progress class="uk-progress portal-progress uk-margin-remove uk-text-left uk-width-expand"
[value]="result.percentage" max="100"></progress>
</div>
<div class="uk-text-capitalize uk-text-muted" *ngIf="result.provenanceAction">
{{result.provenanceAction}}
</div>
</div>
</div>
<!-- Description -->
<div *ngIf="result.description" class="uk-margin-small-bottom multi-line-ellipsis lines-3">
<p class="uk-text-small">
{{result.description}}
</p>
</div>

View File

@ -0,0 +1,73 @@
import {Component, Input, OnInit} from "@angular/core";
import {ResultPreview} from "./result-preview";
import {EnvProperties} from "../properties/env-properties";
import {RouterHelper} from "../routerHelper.class";
import {AlertModal} from "../modal/alert";
@Component({
selector: 'result-preview',
templateUrl: 'result-preview.component.html'
})
export class ResultPreviewComponent implements OnInit{
@Input() result: ResultPreview;
@Input() properties: EnvProperties;
@Input() showSubjects: boolean = true;
@Input() showOrganizations: boolean = true;
@Input() modal: AlertModal = null;
public routerHelper: RouterHelper = new RouterHelper();
public urlParam: string;
ngOnInit(): void {
if (this.result.resultType === "publication") {
this.urlParam = "articleId";
} else if (this.result.resultType === "dataset") {
this.urlParam = "datasetId";
} else if (this.result.resultType === "software") {
this.urlParam = "softwareId";
} else if (this.result.resultType === "other") {
this.urlParam = "orpId";
} else if (this.result.resultType == "project") {
this.urlParam = "projectId";
} else if (this.result.resultType == "organization") {
this.urlParam = "organizationId";
} else if (this.result.resultType == "dataprovider") {
this.urlParam = "datasourceId";
}
}
public getTypeName(type: string): string {
if (type === "dataset") {
return "research data";
} else if (type === "other") {
return "other research product";
} else if (type === "dataprovider") {
return "content provider";
} else {
return type;
}
}
public removeUnknown(array: string[]): string[] {
return array.filter(value => value.toLowerCase() !== 'unknown');
}
public removeDuplicates(array: string[]): string[] {
return array.filter(value => value.toLowerCase() !== this.result.resultType);
}
public accessClass(accessMode: string): string {
if(accessMode.toLowerCase().indexOf('open') !== -1) {
return 'open';
} else if(accessMode.toLowerCase() === 'not available') {
return 'unknown';
} else {
return 'closed';
}
}
public onTitleClick() {
if(this.modal) {
this.modal.cancel();
}
}
}

View File

@ -0,0 +1,13 @@
import {NgModule} from "@angular/core";
import {CommonModule} from "@angular/common";
import {ResultPreviewComponent} from "./result-preview.component";
import {RouterModule} from "@angular/router";
import {ShowAuthorsModule} from "../authors/showAuthors.module";
import {ResultLandingUtilsModule} from "../../landingPages/landing-utils/resultLandingUtils.module";
@NgModule({
imports: [CommonModule, RouterModule, ShowAuthorsModule, ResultLandingUtilsModule],
declarations: [ResultPreviewComponent],
exports: [ResultPreviewComponent]
})
export class ResultPreviewModule {}

View File

@ -0,0 +1,256 @@
import {SearchResult} from "../entities/searchResult";
import {ResultLandingInfo} from "../entities/resultLandingInfo";
import {OrganizationInfo} from "../entities/organizationInfo";
export interface HostedByCollectedFrom {
downloadName: string;
downloadUrl: string[];
collectedName: string;
collectedId: string;
accessMode: string[];
bestAccessMode: string;
type: string;
year: string;
}
export interface Journal {
journal?: string;
issn?: string;
lissn: string;
eissn?: string;
issue?: string;
volume?: string;
start_page?: string;
end_page?: string;
}
export interface RelationResult {
name: string;
id: string;
date: string;
percentage: number;
class: string
provenanceAction?: string;
}
export interface Project {
id: string;
acronym: string;
title: string;
funderShortname: string;
funderName: string;
funding?: string;
code: string;
budget?: string;
contribution?: string;
currency?: string;
provenanceAction?: string;
inline?: boolean
}
export interface Author {
fullName: string;
orcid: string;
}
export interface ResultTitle {
name: string;
accessMode: string;
sc39: string;
}
export interface Organization {
id: string;
name: string;
shortname?: string;
websiteUrl?: string;
country?: string;
trust?: number;
}
export class ResultPreview {
id: string;
title: string;
accessMode: string;
sc39: string;
countries: string[];
//publications & datasets & orp & software & organizations:
projects: Project[];
//datasets & orp & publications & software
description: string;
year: string;
embargoEndDate: Date | string;
authors: Author[];
languages: string[];
identifiers: Map<string, string[]>; //key is the classname
hostedBy_collectedFrom: HostedByCollectedFrom[];
//datasets & orp & software:
publisher: string;
//software
programmingLanguages: string[];
//dataproviders & projects:
organizations: Organization[];
//projects:
acronym: string;
code: string;
funderShortname: string;
budget: string;
contribution: string;
currency: string;
startYear: number;
endYear: number;
openAccessMandatePublications: boolean;
openAccessMandateDatasets: boolean;
//organizations:
country: string;
//dataproviders:
englishname: string;
websiteURL: string;
OAIPMHURL: string;
compatibility: string;
compatibilityUNKNOWN: boolean;
subjects: string[];
resultType: string;
types: string[];
// Relation result
relation: string;
percentage: number;
provenanceAction: string;
public static searchResultConvert(result: SearchResult, type: string): ResultPreview {
let resultPreview: ResultPreview = new ResultPreview();
resultPreview.id = result.id;
resultPreview.title = result.title.name;
resultPreview.accessMode = result.title.accessMode;
resultPreview.sc39 = result.title.sc39;
if(result.countriesForResults) {
resultPreview.countries = result.countries;
} else if(result.country) {
resultPreview.countries = [result.country];
} else {
resultPreview.countries = result.countries;
}
resultPreview.projects = result.projects;
resultPreview.description = result.description;
resultPreview.year = result.year;
resultPreview.embargoEndDate = result.embargoEndDate;
resultPreview.authors = result.authors;
resultPreview.languages = result.languages;
resultPreview.publisher = result.publisher;
resultPreview.programmingLanguages = result.programmingLanguages;
resultPreview.organizations = result.organizations;
resultPreview.acronym = result.acronym;
resultPreview.code = result.code;
resultPreview.funderShortname = result.funderShortname;
resultPreview.budget = result.budget;
resultPreview.contribution = result.contribution;
resultPreview.currency = result.currency;
resultPreview.startYear = result.startYear;
resultPreview.endYear = result.endYear;
resultPreview.openAccessMandatePublications = result.openAccessMandatePublications;
resultPreview.openAccessMandateDatasets = result.openAccessMandateDatasets;
resultPreview.englishname = result.englishname;
if(result.type) {
resultPreview.types = [result.type];
} else {
resultPreview.types = result.types;
}
resultPreview.websiteURL = result.websiteURL;
resultPreview.OAIPMHURL = result.OAIPMHURL;
resultPreview.compatibility = result.compatibility;
resultPreview.compatibilityUNKNOWN = result.compatibilityUNKNOWN;
resultPreview.subjects = result.subjects;
resultPreview.resultType = type;
return resultPreview;
}
public static resultLandingInfoConvert(result: ResultLandingInfo, type: string): ResultPreview {
let resultPreview: ResultPreview = new ResultPreview();
resultPreview.title = result.title;
resultPreview.accessMode = result.accessMode;
resultPreview.countries = result.countries;
resultPreview.projects = result.fundedByProjects;
resultPreview.description = result.description;
if(result.dateofacceptance) {
resultPreview.year = new Date(result.dateofacceptance).getFullYear().toString();
}
resultPreview.embargoEndDate = result.embargoEndDate;
resultPreview.authors = result.authors;
resultPreview.languages = result.languages;
resultPreview.publisher = result.publisher;
resultPreview.programmingLanguages = result.programmingLanguages;
resultPreview.organizations = result.organizations;
resultPreview.types = result.types;
resultPreview.subjects = result.subjects;
resultPreview.resultType = type;
resultPreview.identifiers = result.identifiers;
resultPreview.hostedBy_collectedFrom = result.hostedBy_collectedFrom;
return resultPreview;
}
public static relationResultConvert(result: RelationResult, relation: string = 'trust'): ResultPreview {
let resultPreview: ResultPreview = new ResultPreview();
resultPreview.id = result.id;
resultPreview.title = result.name;
resultPreview.resultType = result.class;
if(result.date) {
resultPreview.year = result.date.toString();
}
resultPreview.relation = relation;
resultPreview.percentage = result.percentage;
resultPreview.provenanceAction = result.provenanceAction;
return resultPreview;
}
public static organizationConvert(result: Organization, relation: string = 'trust'): ResultPreview {
let resultPreview: ResultPreview = new ResultPreview();
resultPreview.id = result.id;
if(result.name) {
resultPreview.title = result.name;
if(result.shortname) {
resultPreview.title += ' (' + result.shortname + ')';
}
} else if(result.shortname) {
resultPreview.title = result.shortname;
}
if(result.country) {
resultPreview.countries = [result.country];
}
resultPreview.relation = relation;
resultPreview.percentage = result.trust;
resultPreview.websiteURL = result.websiteUrl;
resultPreview.resultType = 'organization';
return resultPreview;
}
public static organizationInfoConvert(result: OrganizationInfo): ResultPreview {
let resultPreview: ResultPreview = new ResultPreview();
if(result.title && result.title.name) {
resultPreview.title = result.title.name;
if(result.name) {
resultPreview.title += ' (' + result.name + ')';
}
} else if(result.name) {
resultPreview.title = result.name;
}
if(result.country) {
resultPreview.countries = [result.country];
}
if(result.title && result.title.url) {
resultPreview.websiteURL = result.title.url;
}
resultPreview.resultType = 'organization';
return resultPreview;
}
}