1. Fix uk-drop in available on. 2. Entity metadata: Add bullet with css in order to avoid empty content. 3. Add Deposit and embed in actions of entity-actions.
This commit is contained in:
parent
f0f1874039
commit
63b466fdaf
|
@ -26,7 +26,7 @@ declare var UIkit;
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
<div #dropElement uk-drop="mode: click; pos: bottom-left;"
|
<div #dropElement uk-drop="mode: click; pos: bottom-left;"
|
||||||
class="download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small">
|
class="uk-drop download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small">
|
||||||
<ng-container *ngTemplateOutlet="availableOnList"></ng-container>
|
<ng-container *ngTemplateOutlet="availableOnList"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
|
@ -0,0 +1,11 @@
|
||||||
|
@import (reference) "~src/assets/openaire-theme/less/_import-variables";
|
||||||
|
|
||||||
|
.entity-metadata {
|
||||||
|
|
||||||
|
& > *:not(:last-child):not(.other-separator)::after {
|
||||||
|
content: "\2022";
|
||||||
|
font-weight: normal;
|
||||||
|
margin-left: @global-xsmall-margin;
|
||||||
|
margin-right: @global-xsmall-margin;
|
||||||
|
}
|
||||||
|
}
|
|
@ -7,83 +7,78 @@ import {Organization, Project} from "../../utils/result-preview/result-preview";
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'entity-metadata',
|
selector: 'entity-metadata',
|
||||||
template: `
|
template: `
|
||||||
<div class="uk-text-xsmall uk-text-emphasis uk-flex uk-flex-middle uk-flex-wrap">
|
<div class="uk-text-xsmall entity-metadata uk-flex-inline uk-flex-wrap uk-text-emphasis">
|
||||||
<!-- oa -->
|
<!-- oa -->
|
||||||
<ng-container
|
<span class="uk-flex-inline uk-flex-middle uk-flex-wrap"
|
||||||
*ngIf="(openAccessMandatePublications != undefined && openAccessMandatePublications) || (openAccessMandateDatasets != undefined && openAccessMandateDatasets)">
|
*ngIf="(openAccessMandatePublications != undefined && openAccessMandatePublications) || (openAccessMandateDatasets != undefined && openAccessMandateDatasets)">
|
||||||
<span class="uk-margin-xsmall-right open-access">
|
<span class="uk-margin-xsmall-right open-access">
|
||||||
<icon name="open_access" [flex]="true" [ratio]="0.8"></icon>
|
<icon name="open_access" [flex]="true" [ratio]="0.8"></icon>
|
||||||
</span>
|
</span>
|
||||||
<span class="uk-text-bolder"
|
<span class="uk-text-bolder"
|
||||||
*ngIf="openAccessMandatePublications != undefined && openAccessMandatePublications && openAccessMandateDatasets != undefined && openAccessMandateDatasets">
|
*ngIf="openAccessMandatePublications != undefined && openAccessMandatePublications && openAccessMandateDatasets != undefined && openAccessMandateDatasets">
|
||||||
Open Access Mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}
|
Open Access Mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}
|
||||||
</span>
|
</span>
|
||||||
<span class="uk-text-bolder"
|
<span class="uk-text-bolder"
|
||||||
*ngIf="openAccessMandatePublications != undefined && openAccessMandatePublications && (openAccessMandateDatasets == undefined || !openAccessMandateDatasets)">
|
*ngIf="openAccessMandatePublications != undefined && openAccessMandatePublications && (openAccessMandateDatasets == undefined || !openAccessMandateDatasets)">
|
||||||
Open Access Mandate for {{openaireEntities.PUBLICATIONS}}
|
Open Access Mandate for {{openaireEntities.PUBLICATIONS}}
|
||||||
</span>
|
</span>
|
||||||
<span class="uk-text-bolder"
|
<span class="uk-text-bolder"
|
||||||
*ngIf="openAccessMandateDatasets != undefined && openAccessMandateDatasets && (openAccessMandatePublications == undefined || !openAccessMandatePublications)">
|
*ngIf="openAccessMandateDatasets != undefined && openAccessMandateDatasets && (openAccessMandatePublications == undefined || !openAccessMandatePublications)">
|
||||||
Open Access Mandate for {{openaireEntities.DATASETS}}
|
Open Access Mandate for {{openaireEntities.DATASETS}}
|
||||||
</span>
|
</span>
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
</ng-container>
|
|
||||||
<!-- types -->
|
|
||||||
<span *ngIf="entityType" class="uk-margin-xsmall-right">
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'publication'" name="description" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'research data'" name="database" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'research software'" name="integration_instructions"
|
|
||||||
type="outlined" [flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'other research product'" name="apps" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'project'" name="assignment_turned_in" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'data source'" name="note_add" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
<icon *ngIf="entityType.toLowerCase() == 'organization'" name="corporate_fare" type="outlined"
|
|
||||||
[flex]="true" [ratio]="0.8"></icon>
|
|
||||||
</span>
|
</span>
|
||||||
<u *ngIf="entityType" class="uk-text-capitalize uk-text-bolder">{{entityType}}</u>
|
<!-- types -->
|
||||||
<span *ngIf="entityType && types && removeUnknown(types, true).length > 0">
|
<span *ngIf="entityType" class="uk-flex-inline uk-flex-middle uk-flex-wrap"
|
||||||
<icon name="keyboard_double_arrow_right" [flex]="true" [ratio]="0.8"></icon>
|
[class.other-separator]="types && removeUnknown(types, true).length > 0">
|
||||||
|
<span class="uk-margin-xsmall-right">
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'publication'" name="description" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'research data'" name="database" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'research software'" name="integration_instructions"
|
||||||
|
type="outlined" [flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'other research product'" name="apps" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'project'" name="assignment_turned_in" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'data source'" name="note_add" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
<icon *ngIf="entityType.toLowerCase() == 'organization'" name="corporate_fare" type="outlined"
|
||||||
|
[flex]="true" [ratio]="0.8"></icon>
|
||||||
|
</span>
|
||||||
|
<u class="uk-text-capitalize uk-text-bolder">{{entityType}}</u>
|
||||||
|
<span *ngIf="types && removeUnknown(types, true).length > 0">
|
||||||
|
<icon name="keyboard_double_arrow_right" [flex]="true" [ratio]="0.8"></icon>
|
||||||
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<span *ngIf="types && removeUnknown(types, true).length > 0" class="uk-text-italic">
|
<span *ngIf="types && removeUnknown(types, true).length > 0" class="uk-text-italic">
|
||||||
{{removeUnknown(types, true).join(' , ')}}
|
{{removeUnknown(types, true).join(' , ')}}
|
||||||
</span>
|
</span>
|
||||||
<!-- years -->
|
<!-- years -->
|
||||||
<ng-container *ngIf="year">
|
<ng-container *ngIf="year">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{year}}</span>
|
<span>{{year}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="startYear && !endYear">
|
<ng-container *ngIf="startYear && !endYear">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{startYear}}</span>
|
<span>{{startYear}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="!startYear && endYear">
|
<ng-container *ngIf="!startYear && endYear">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{endYear}}</span>
|
<span>{{endYear}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="startYear && endYear">
|
<ng-container *ngIf="startYear && endYear">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<ng-container>
|
<ng-container>
|
||||||
<span>{{startYear}} - {{endYear}}</span>
|
<span>{{startYear}} - {{endYear}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<!-- dates -->
|
<!-- dates -->
|
||||||
<ng-container *ngIf="startDate && !endDate">
|
<span *ngIf="startDate && !endDate">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span class="uk-margin-xsmall-right">From</span>
|
<span class="uk-margin-xsmall-right">From</span>
|
||||||
<span>{{startDate | date: 'dd MMM yyyy'}}</span>
|
<span>{{startDate | date: 'dd MMM yyyy'}}</span>
|
||||||
</ng-container>
|
</span>
|
||||||
<ng-container *ngIf="!startDate && endDate">
|
<span *ngIf="!startDate && endDate">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span class="uk-margin-xsmall-right">Until</span>
|
<span class="uk-margin-xsmall-right">Until</span>
|
||||||
<span>{{endDate | date: 'dd MMM yyyy'}}</span>
|
<span>{{endDate | date: 'dd MMM yyyy'}}</span>
|
||||||
</ng-container>
|
</span>
|
||||||
<ng-container *ngIf="startDate && endDate">
|
<span *ngIf="startDate && endDate">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<ng-container *ngIf="startDate">
|
<ng-container *ngIf="startDate">
|
||||||
<span>{{startDate | date: 'dd MMM yyyy'}}</span>
|
<span>{{startDate | date: 'dd MMM yyyy'}}</span>
|
||||||
<span class="uk-margin-xsmall-left">(Started)</span>
|
<span class="uk-margin-xsmall-left">(Started)</span>
|
||||||
|
@ -93,50 +88,38 @@ import {Organization, Project} from "../../utils/result-preview/result-preview";
|
||||||
<span>{{endDate | date: 'dd MMM yyyy'}}</span>
|
<span>{{endDate | date: 'dd MMM yyyy'}}</span>
|
||||||
<span class="uk-margin-xsmall-left">{{currentDate >= endDate ? '(Ended)' : '(Ending)'}}</span>
|
<span class="uk-margin-xsmall-left">{{currentDate >= endDate ? '(Ended)' : '(Ending)'}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</ng-container>
|
</span>
|
||||||
<ng-container *ngIf="status">
|
<ng-container *ngIf="status">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{status}}</span>
|
<span>{{status}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="date">
|
<ng-container *ngIf="date">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{date | date: 'dd MMM yyyy': 'UTC'}}</span>
|
<span>{{date | date: 'dd MMM yyyy': 'UTC'}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="embargoEndDate">
|
<ng-container *ngIf="embargoEndDate">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>Embargo end date: {{embargoEndDate | date: 'dd MMM yyyy'}}</span>
|
<span>Embargo end date: {{embargoEndDate | date: 'dd MMM yyyy'}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<span *ngIf="underCuration">
|
<span *ngIf="underCuration">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
<span title="{{buildCurationTooltip()}}" uk-tooltip="pos:bottom-right; delay:10;"
|
||||||
<span title="{{buildCurationTooltip()}}"uk-tooltip="pos:bottom-right; delay:10;"
|
|
||||||
class="uk-text-primary">Under curation</span>
|
class="uk-text-primary">Under curation</span>
|
||||||
</span>
|
</span>
|
||||||
<!-- countries -->
|
<!-- countries -->
|
||||||
<ng-container *ngIf="countries && removeUnknown(countries).length > 0">
|
<span *ngIf="countries && removeUnknown(countries).length > 0">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
{{removeUnknown(countries).join(', ')}}
|
||||||
<ng-container *ngFor="let country of removeUnknown(countries)">
|
</span>
|
||||||
<span>{{country}}</span>
|
|
||||||
</ng-container>
|
|
||||||
</ng-container>
|
|
||||||
<!-- languages -->
|
<!-- languages -->
|
||||||
<ng-container *ngIf="languages && removeUnknown(languages).length > 0">
|
<span *ngIf="languages && removeUnknown(languages).length > 0">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
{{removeUnknown(languages).join(', ')}}
|
||||||
<ng-container *ngFor="let language of removeUnknown(languages)">
|
</span>
|
||||||
<span>{{language}}</span>
|
|
||||||
</ng-container>
|
|
||||||
</ng-container>
|
|
||||||
<!-- programming languages -->
|
<!-- programming languages -->
|
||||||
<ng-container *ngIf="programmingLanguages && programmingLanguages.length > 0">
|
<span *ngIf="programmingLanguages && removeUnknown(programmingLanguages).length > 0"
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
class="uk-flex uk-flex-middle uk-flex-wrap">
|
||||||
<ng-container *ngFor="let programmingLanguage of programmingLanguages">
|
{{removeUnknown(programmingLanguages).join(', ')}}
|
||||||
<span>{{programmingLanguage}}</span>
|
</span>
|
||||||
</ng-container>
|
|
||||||
</ng-container>
|
|
||||||
<!-- published info -->
|
<!-- published info -->
|
||||||
<showPublisher [publisher]="publisher" [journal]="journal" [properties]="properties"></showPublisher>
|
<showPublisher *ngIf="publisher || journal" [publisher]="publisher" [journal]="journal"
|
||||||
|
[properties]="properties"></showPublisher>
|
||||||
<!-- data provider labels -->
|
<!-- data provider labels -->
|
||||||
<ng-container *ngIf="compatibility && !(compatibility.info == 'not available' && type == 'service')">
|
<ng-container *ngIf="compatibility && !(compatibility.info == 'not available' && type == 'service')">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span uk-tooltip title="Compatibility">
|
<span uk-tooltip title="Compatibility">
|
||||||
<a *ngIf="compatibility.id"
|
<a *ngIf="compatibility.id"
|
||||||
[queryParams]="{datasourceId: compatibility.id}" routerLinkActive="router-link-active"
|
[queryParams]="{datasourceId: compatibility.id}" routerLinkActive="router-link-active"
|
||||||
|
@ -157,62 +140,36 @@ import {Organization, Project} from "../../utils/result-preview/result-preview";
|
||||||
</span>
|
</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="compatibilityString">
|
<ng-container *ngIf="compatibilityString">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span uk-tooltip title="Compatibility">{{compatibilityString}}</span>
|
<span uk-tooltip title="Compatibility">{{compatibilityString}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container
|
<ng-container
|
||||||
*ngIf="aggregationStatus && aggregationStatus.fulltexts && aggregationStatus.fulltexts > 0">
|
*ngIf="aggregationStatus && aggregationStatus.fulltexts && aggregationStatus.fulltexts > 0">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>OpenAIRE Text Mining</span>
|
<span>OpenAIRE Text Mining</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="thematic">
|
<ng-container *ngIf="thematic">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>Thematic</span>
|
<span>Thematic</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<!-- Projects -->
|
<!-- Projects -->
|
||||||
<ng-container *ngIf="projects && projects.length > 0">
|
<span uk-tooltip="Projects" *ngIf="projects && projects.length > 0" [class.truncated]="projects.length > 3">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
{{projectNames.slice(0,3).join(', ')}}
|
||||||
<span uk-tooltip="Project" *ngFor="let project of projects.slice(0,3) let i=index">
|
</span>
|
||||||
<span class="space">
|
|
||||||
{{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 < projects.length-1">, </span>
|
|
||||||
</span>
|
|
||||||
<span *ngIf="projects.length > 3">...</span>
|
|
||||||
</ng-container>
|
|
||||||
<!-- Organizations -->
|
<!-- Organizations -->
|
||||||
<ng-container *ngIf="organizations && organizations.length > 0">
|
<span uk-tooltip="Partners" *ngIf="organizations && organizations.length > 0" [class.truncated]="organizations.length > 3">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
{{organizationNames.slice(0, 3).join(', ')}}
|
||||||
<span uk-tooltip="Partner" *ngFor="let organization of organizations.slice(0,3) let i=index">
|
</span>
|
||||||
<span class="space">{{organization.name}}</span>
|
|
||||||
<span *ngIf="i < organizations.length-1">, </span>
|
|
||||||
</span>
|
|
||||||
<span *ngIf="organizations.length > 3">...</span>
|
|
||||||
</ng-container>
|
|
||||||
<!-- Subjects -->
|
<!-- Subjects -->
|
||||||
<ng-container *ngIf="subjects && subjects.length > 0">
|
<span uk-tooltip="Subjects" *ngIf="subjects && subjects.length > 0" [class.truncated]="subjects.length > 3">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
{{subjects.slice(0, 3).join(', ')}}
|
||||||
<span uk-tooltip="Subject" *ngFor="let subject of subjects.slice(0,3) let i = index">
|
</span>
|
||||||
<span class="space">{{subject}}</span>
|
|
||||||
<span *ngIf="i < subjects.length - 1">, </span>
|
|
||||||
</span>
|
|
||||||
<span *ngIf="subjects.length > 3">...</span>
|
|
||||||
</ng-container>
|
|
||||||
<ng-container *ngIf="provenanceAction">
|
<ng-container *ngIf="provenanceAction">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{provenanceAction}}</span>
|
<span>{{provenanceAction}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="relationName">
|
<ng-container *ngIf="relationName">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
|
||||||
<span>{{relationName}}</span>
|
<span>{{relationName}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
`
|
`,
|
||||||
|
styleUrls: ['entity-metadata.component.less']
|
||||||
})
|
})
|
||||||
export class EntityMetadataComponent {
|
export class EntityMetadataComponent {
|
||||||
@Input() entityType: string;
|
@Input() entityType: string;
|
||||||
|
@ -269,4 +226,28 @@ export class EntityMetadataComponent {
|
||||||
tooltipContent += "</div>";
|
tooltipContent += "</div>";
|
||||||
return tooltipContent;
|
return tooltipContent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get projectNames(): string[] {
|
||||||
|
if (this.projects && this.projects.length > 0) {
|
||||||
|
return this.projects.map(project => {
|
||||||
|
let value = project.funderShortname ? project.funderShortname : project.funderName;
|
||||||
|
if (project.acronym || project.title) {
|
||||||
|
value = value + ' | ' + (project.acronym ? project.acronym :
|
||||||
|
(project.title.length > 25 ? (project.title.slice(0, 25) + '...'): project.title));
|
||||||
|
}
|
||||||
|
if(project.code) {
|
||||||
|
value = value + ' (' + project.code + ')';
|
||||||
|
}
|
||||||
|
return value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
|
||||||
|
get organizationNames(): string[] {
|
||||||
|
if (this.organizations && this.organizations.length > 0) {
|
||||||
|
return this.organizations.map(organization => organization.name);
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,6 @@ import {EnvProperties} from "../../utils/properties/env-properties";
|
||||||
|| journal['volume'] || journal['eissn'] || journal['issue'])">
|
|| journal['volume'] || journal['eissn'] || journal['issue'])">
|
||||||
<ng-container *ngIf="journal && (journal['journal'] || journal['issn'] || journal['lissn']
|
<ng-container *ngIf="journal && (journal['journal'] || journal['issn'] || journal['lissn']
|
||||||
|| journal['volume'] || journal['eissn'] || journal['issue'])">
|
|| journal['volume'] || journal['eissn'] || journal['issue'])">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right">•</span>
|
|
||||||
<span [attr.uk-tooltip]="'cls: uk-active'" [title]="'Journal'">
|
<span [attr.uk-tooltip]="'cls: uk-active'" [title]="'Journal'">
|
||||||
<span *ngIf="journal['journal']">{{journal['journal']}}</span>
|
<span *ngIf="journal['journal']">{{journal['journal']}}</span>
|
||||||
<span *ngIf="journal['journal'] && (journal['volume'] || journal['issue'])">, </span>
|
<span *ngIf="journal['journal'] && (journal['volume'] || journal['issue'])">, </span>
|
||||||
|
@ -65,9 +64,9 @@ import {EnvProperties} from "../../utils/properties/env-properties";
|
||||||
<span *ngIf=" journal['journal'] && (journal['issn'] || journal['eissn'] || journal['lissn'])">)</span>
|
<span *ngIf=" journal['journal'] && (journal['issn'] || journal['eissn'] || journal['lissn'])">)</span>
|
||||||
</span>
|
</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
<span *ngIf="publisher" class="uk-margin-xsmall-left uk-margin-xsmall-right bullet"></span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="publisher">
|
<ng-container *ngIf="publisher">
|
||||||
<span class="uk-margin-xsmall-left uk-margin-xsmall-right">•</span>
|
|
||||||
<span [attr.uk-tooltip]="'cls: uk-active'" [title]="'Publisher'">{{publisher}}</span>
|
<span [attr.uk-tooltip]="'cls: uk-active'" [title]="'Publisher'">{{publisher}}</span>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
`
|
`
|
||||||
|
|
|
@ -1,17 +1,21 @@
|
||||||
import {Component, Input, ViewChild} from "@angular/core";
|
import {Component, Input, OnInit, ViewChild} from "@angular/core";
|
||||||
import {StringUtils} from "../string-utils.class";
|
import {StringUtils} from "../string-utils.class";
|
||||||
import {RouterHelper} from "../routerHelper.class";
|
import {RouterHelper} from "../routerHelper.class";
|
||||||
import {properties} from "../../../../environments/environment";
|
import {properties} from "../../../../environments/environment";
|
||||||
|
import {Router} from "@angular/router";
|
||||||
|
import {Option} from "../../sharedComponents/input/input.component";
|
||||||
|
import {OpenaireEntities} from "../properties/searchFields";
|
||||||
|
import {EnvProperties} from "../properties/env-properties";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'entity-actions',
|
selector: 'entity-actions',
|
||||||
template: `
|
template: `
|
||||||
<div class="uk-grid uk-grid-small uk-child-width-auto" uk-grid>
|
<div class="uk-grid uk-grid-small uk-child-width-auto" uk-grid>
|
||||||
<a *ngIf="linking"
|
<a *ngIf="linking && isRouteAvailable('participate/direct-claim')"
|
||||||
[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'], [id,type,linkTo])"
|
[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'], [id,type,linkTo])"
|
||||||
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"
|
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"
|
||||||
[title]="'Link this '+getTypeName()+' to ...'"
|
[title]="'Link this '+getTypeName()+' to ...'"
|
||||||
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'"
|
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
|
||||||
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||||
<icon [flex]="true" [ratio]="0.7" name="link_to" visuallyHidden="link"></icon>
|
<icon [flex]="true" [ratio]="0.7" name="link_to" visuallyHidden="link"></icon>
|
||||||
<span class="uk-margin-xsmall-left">Link to</span>
|
<span class="uk-margin-xsmall-left">Link to</span>
|
||||||
|
@ -26,34 +30,87 @@ import {properties} from "../../../../environments/environment";
|
||||||
<icon [flex]="true" [ratio]="0.7" name="cite" visuallyHidden="cite"></icon>
|
<icon [flex]="true" [ratio]="0.7" name="cite" visuallyHidden="cite"></icon>
|
||||||
<span class="uk-margin-xsmall-left">Cite</span>
|
<span class="uk-margin-xsmall-left">Cite</span>
|
||||||
</a>
|
</a>
|
||||||
|
<a *ngIf="deposit && isRouteAvailable('participate/deposit/learn-how')" routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how"
|
||||||
|
[title]="'Find a repository to deposit or publish your research in Open Access'"
|
||||||
|
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
|
||||||
|
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||||
|
<icon flex="true" ratio="0.7" name="upload" visuallyHidden="upload"></icon>
|
||||||
|
<span class="uk-margin-xsmall-left">Deposit</span>
|
||||||
|
</a>
|
||||||
|
<a *ngIf="embed" (click)="openEmbedResultsModal()"
|
||||||
|
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||||
|
<icon flex="true" ratio="0.8" name="code_off" visuallyHidden="code"></icon>
|
||||||
|
<span class="uk-margin-xsmall-left">Embed</span>
|
||||||
|
</a>
|
||||||
<ng-content></ng-content>
|
<ng-content></ng-content>
|
||||||
</div>
|
</div>
|
||||||
<modal-alert *ngIf="cite" #citeModal>
|
<modal-alert *ngIf="cite" #citeModal>
|
||||||
<citeThis *ngIf="citeThisClicked" [result]="result" [id]="id"
|
<citeThis *ngIf="citeThisClicked" [result]="result" [id]="id"
|
||||||
[type]="getTypeName().toLowerCase()" [piwikSiteId]="piwikSiteId"></citeThis>
|
[type]="getTypeName().toLowerCase()" [piwikSiteId]="properties.piwikSiteId"></citeThis>
|
||||||
</modal-alert>
|
</modal-alert>
|
||||||
<modal-alert *ngIf="share" #addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
|
<modal-alert *ngIf="share" #addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
|
||||||
<addThis [url]="url"></addThis>
|
<addThis [url]="url"></addThis>
|
||||||
</modal-alert>
|
</modal-alert>
|
||||||
|
<modal-alert *ngIf="result" #embedResultsModal large="true">
|
||||||
|
<div class="uk-padding-small uk-margin-small-left uk-margin-small-right">
|
||||||
|
<div class="uk-padding-small uk-padding-remove-vertical">
|
||||||
|
<div input type="select" placeholder="Select content type to embed" inputClass="flat x-small"
|
||||||
|
[options]="resultTypesForEmbedding" [(value)]="embed_research_results_type"></div>
|
||||||
|
<div *ngIf="embed_research_results_type" class="clipboard-wrapper box-content uk-grid uk-margin-auto uk-margin-small-top ">
|
||||||
|
<pre id="dynamic_content_id" class="uk-overflow-auto uk-padding-small uk-padding-remove-vertical uk-margin-top"><code
|
||||||
|
>{{getDynamicContent(embed_research_results_type)}}</code></pre>
|
||||||
|
<div class="uk-width-1-1 uk-padding-small uk-text-right">
|
||||||
|
<a class="uk-link copy clipboard_btn" data-clipboard-target="#dynamic_content_id" title="Copy script">
|
||||||
|
COPY SCRIPT
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="uk-text-small uk-margin-top">
|
||||||
|
For further information contact us at
|
||||||
|
<u><a [href]="'mailto:'+properties.helpdeskEmail" class="uk-link-text">{{properties.helpdeskEmail}}</a></u>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</modal-alert>
|
||||||
`
|
`
|
||||||
})
|
})
|
||||||
export class EntityActionsComponent {
|
export class EntityActionsComponent implements OnInit {
|
||||||
@Input() result: any;
|
@Input() result: any;
|
||||||
@Input() type: string;
|
@Input() type: string;
|
||||||
@Input() id: string;
|
@Input() id: string;
|
||||||
@Input() linking: boolean = false;
|
@Input() linking: boolean = false;
|
||||||
@Input() share: boolean = false;
|
@Input() share: boolean = false;
|
||||||
@Input() cite: boolean = false;
|
@Input() cite: boolean = false;
|
||||||
|
@Input() deposit: boolean = false;
|
||||||
|
@Input() embed: boolean = false;
|
||||||
@Input() url: string;
|
@Input() url: string;
|
||||||
public piwikSiteId = properties.piwikSiteId;
|
|
||||||
public citeThisClicked: boolean;
|
public citeThisClicked: boolean;
|
||||||
public routerHelper: RouterHelper = new RouterHelper();
|
public routerHelper: RouterHelper = new RouterHelper();
|
||||||
@ViewChild('citeModal') citeModal;
|
@ViewChild('citeModal') citeModal;
|
||||||
|
@ViewChild('embedResultsModal') embedResultsModal;
|
||||||
|
@ViewChild('downloadReportModal') downloadReportModal;
|
||||||
@ViewChild('addThisModal') addThisModal;
|
@ViewChild('addThisModal') addThisModal;
|
||||||
|
properties: EnvProperties = properties;
|
||||||
constructor() {
|
|
||||||
|
|
||||||
|
/* Embed */
|
||||||
|
public embed_research_results_type: string = "result";
|
||||||
|
public clipboard;
|
||||||
|
public resultTypesForEmbedding: Option[]=[
|
||||||
|
{label: "All "+OpenaireEntities.RESULTS, value: "result"},
|
||||||
|
{label: OpenaireEntities.PUBLICATIONS, value: "publication"},
|
||||||
|
{label: OpenaireEntities.DATASETS, value: "dataset"},
|
||||||
|
{label: OpenaireEntities.SOFTWARE, value: "software"},
|
||||||
|
{label: OpenaireEntities.OTHER, value: "other"}];
|
||||||
|
|
||||||
|
constructor(private router: Router) {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.createClipboard();
|
||||||
|
}
|
||||||
|
|
||||||
get linkTo():string {
|
get linkTo():string {
|
||||||
return this.type === 'project'?'result':'project';
|
return this.type === 'project'?'result':'project';
|
||||||
}
|
}
|
||||||
|
@ -71,10 +128,48 @@ export class EntityActionsComponent {
|
||||||
}
|
}
|
||||||
|
|
||||||
public openAddThisModal() {
|
public openAddThisModal() {
|
||||||
console.log(this.url);
|
|
||||||
this.addThisModal.cancelButton = false;
|
this.addThisModal.cancelButton = false;
|
||||||
this.addThisModal.okButton = false;
|
this.addThisModal.okButton = false;
|
||||||
this.addThisModal.alertTitle = "Share this " + this.getTypeName() + " in your social networks";
|
this.addThisModal.alertTitle = "Share this " + this.getTypeName() + " in your social networks";
|
||||||
this.addThisModal.open();
|
this.addThisModal.open();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public openEmbedResultsModal() {
|
||||||
|
this.embedResultsModal.cancelButton = false;
|
||||||
|
this.embedResultsModal.okButton = false;
|
||||||
|
this.embedResultsModal.alertTitle = "Embed results";
|
||||||
|
this.embedResultsModal.open();
|
||||||
|
}
|
||||||
|
|
||||||
|
private createClipboard() {
|
||||||
|
if (typeof window !== 'undefined') {
|
||||||
|
delete this.clipboard;
|
||||||
|
let Clipboard;
|
||||||
|
Clipboard = require('clipboard');
|
||||||
|
this.clipboard = new Clipboard('.clipboard_btn');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
getDynamicContent(type: string) {
|
||||||
|
return "<script type=\"text/javascript\">"
|
||||||
|
+ "\n<!--"
|
||||||
|
+ "\ndocument.write('<div id=\"oa_widget\"></div>');"
|
||||||
|
+ "\ndocument.write('<script type=\"text/javascript\""
|
||||||
|
+ " src=\"" + this.properties.widgetLink
|
||||||
|
+ this.result.id + "&type="
|
||||||
|
+ type
|
||||||
|
+ "\"></script>');"
|
||||||
|
+ "\n-->"
|
||||||
|
+ "\n</script>";
|
||||||
|
}
|
||||||
|
|
||||||
|
isRouteAvailable(routeToCheck: string) {
|
||||||
|
for (let i = 0; i < this.router.config.length; i++) {
|
||||||
|
let routePath: string = this.router.config[i].path;
|
||||||
|
if (routePath == routeToCheck) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,14 +1,15 @@
|
||||||
import {NgModule} from "@angular/core";
|
import {NgModule} from "@angular/core";
|
||||||
import {CommonModule} from "@angular/common";
|
import {CommonModule} from "@angular/common";
|
||||||
import {EntityActionsComponent} from "./entity-actions.component";
|
import {EntityActionsComponent} from "./entity-actions.component";
|
||||||
import {RouterLinkWithHref} from "@angular/router";
|
import {RouterModule} from "@angular/router";
|
||||||
import {IconsModule} from "../icons/icons.module";
|
import {IconsModule} from "../icons/icons.module";
|
||||||
import {AlertModalModule} from "../modal/alertModal.module";
|
import {AlertModalModule} from "../modal/alertModal.module";
|
||||||
import {CiteThisModule} from "../../landingPages/landing-utils/citeThis/citeThis.module";
|
import {CiteThisModule} from "../../landingPages/landing-utils/citeThis/citeThis.module";
|
||||||
import {LandingModule} from "../../landingPages/landing-utils/landing.module";
|
import {LandingModule} from "../../landingPages/landing-utils/landing.module";
|
||||||
|
import {InputModule} from "../../sharedComponents/input/input.module";
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [CommonModule, RouterLinkWithHref, IconsModule, AlertModalModule, CiteThisModule, LandingModule],
|
imports: [CommonModule, IconsModule, AlertModalModule, CiteThisModule, LandingModule, RouterModule, InputModule],
|
||||||
declarations: [EntityActionsComponent],
|
declarations: [EntityActionsComponent],
|
||||||
exports: [EntityActionsComponent]
|
exports: [EntityActionsComponent]
|
||||||
})
|
})
|
||||||
|
|
|
@ -171,8 +171,10 @@
|
||||||
<availableOn [availableOn]="result.hostedBy_collectedFrom"></availableOn>
|
<availableOn [availableOn]="result.hostedBy_collectedFrom"></availableOn>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="hasActions" class="uk-width-expand uk-visible@m">
|
<div *ngIf="hasActions" class="uk-width-expand uk-visible@m">
|
||||||
<entity-actions [cite]="cite" [share]="share" [linking]="linking" [type]="result.resultType"
|
<entity-actions [cite]="cite" [share]="share" [linking]="linking"
|
||||||
[result]="result" [id]="result.objId"
|
[deposit]="deposit" [embed]="embed"
|
||||||
|
[type]="result.resultType"
|
||||||
|
[result]="result" [id]="result.objId?result.objId:result.id"
|
||||||
[url]="properties.domain + properties.baseLink + url + '?' + urlParam + '=' + result.id">
|
[url]="properties.domain + properties.baseLink + url + '?' + urlParam + '=' + result.id">
|
||||||
<span *ngIf="orcid">
|
<span *ngIf="orcid">
|
||||||
<orcid-work *ngIf="showOrcid && result.identifiers && result.identifiers.size > 0"
|
<orcid-work *ngIf="showOrcid && result.identifiers && result.identifiers.size > 0"
|
||||||
|
|
|
@ -33,7 +33,6 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
|
||||||
@Input() externalUrl: string;
|
@Input() externalUrl: string;
|
||||||
@Input() showOrcid: boolean = true;
|
@Input() showOrcid: boolean = true;
|
||||||
@Input() showEnermaps: boolean = false;
|
@Input() showEnermaps: boolean = false;
|
||||||
@Input() deposit: boolean = false;
|
|
||||||
@Input() provenanceActionVocabulary = null;
|
@Input() provenanceActionVocabulary = null;
|
||||||
@Input() relationsVocabulary = null;
|
@Input() relationsVocabulary = null;
|
||||||
|
|
||||||
|
@ -47,6 +46,8 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
|
||||||
public share: boolean = false;
|
public share: boolean = false;
|
||||||
public cite: boolean = false;
|
public cite: boolean = false;
|
||||||
public orcid: boolean = false;
|
public orcid: boolean = false;
|
||||||
|
public deposit: boolean = false;
|
||||||
|
public embed: boolean = false;
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
if (this.hasLink) {
|
if (this.hasLink) {
|
||||||
|
@ -74,9 +75,11 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
|
||||||
this.urlParam = "grantId";
|
this.urlParam = "grantId";
|
||||||
}
|
}
|
||||||
this.url = properties.searchLinkToProject.split('?')[0];
|
this.url = properties.searchLinkToProject.split('?')[0];
|
||||||
|
this.projectActions();
|
||||||
} else if (this.result.resultType == "organization") {
|
} else if (this.result.resultType == "organization") {
|
||||||
this.urlParam = "organizationId";
|
this.urlParam = "organizationId";
|
||||||
this.url = properties.searchLinkToOrganization.split('?')[0];
|
this.url = properties.searchLinkToOrganization.split('?')[0];
|
||||||
|
this.organizationActions();
|
||||||
} else if (this.result.resultType == "dataprovider") {
|
} else if (this.result.resultType == "dataprovider") {
|
||||||
if (this.result.compatibilityUNKNOWN && properties.adminToolsPortalType == "eosc") {
|
if (this.result.compatibilityUNKNOWN && properties.adminToolsPortalType == "eosc") {
|
||||||
this.urlParam = "serviceId";
|
this.urlParam = "serviceId";
|
||||||
|
@ -85,6 +88,7 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
|
||||||
this.urlParam = "datasourceId";
|
this.urlParam = "datasourceId";
|
||||||
this.url = properties.searchLinkToDataProvider.split('?')[0];
|
this.url = properties.searchLinkToDataProvider.split('?')[0];
|
||||||
}
|
}
|
||||||
|
this.contentProviderActions();
|
||||||
} else if (this.result.resultType == "service") {
|
} else if (this.result.resultType == "service") {
|
||||||
this.urlParam = "serviceId";
|
this.urlParam = "serviceId";
|
||||||
this.url = properties.searchLinkToService.split('?')[0];
|
this.url = properties.searchLinkToService.split('?')[0];
|
||||||
|
@ -110,6 +114,21 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
|
||||||
this.orcid = (this.properties.adminToolsPortalType == 'explore' || this.properties.adminToolsPortalType == 'community' || this.properties.adminToolsPortalType == 'aggregator') &&
|
this.orcid = (this.properties.adminToolsPortalType == 'explore' || this.properties.adminToolsPortalType == 'community' || this.properties.adminToolsPortalType == 'aggregator') &&
|
||||||
this.showOrcid && this.result.identifiers && this.result.identifiers.size > 0;
|
this.showOrcid && this.result.identifiers && this.result.identifiers.size > 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
projectActions() {
|
||||||
|
this.linking = true;
|
||||||
|
this.share = true;
|
||||||
|
this.deposit = true;
|
||||||
|
this.embed = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
organizationActions() {
|
||||||
|
this.share = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
contentProviderActions() {
|
||||||
|
this.share = true;
|
||||||
|
}
|
||||||
|
|
||||||
ngOnChanges(changes: SimpleChanges) {
|
ngOnChanges(changes: SimpleChanges) {
|
||||||
if (changes.result && this.hasLink) {
|
if (changes.result && this.hasLink) {
|
||||||
|
|
Loading…
Reference in New Issue