Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme

This commit is contained in:
argirok 2022-04-21 15:29:09 +03:00
commit e79275be2a
19 changed files with 473 additions and 325 deletions

View File

@ -52,7 +52,7 @@
</div>
<div>
<div class="uk-grid uk-flex-top" uk-grid>
<div input class="uk-width-expand" [formInput]="form.get('email')" placeholder="E-mail">
<div input class="uk-width-expand@m uk-width-1-1" [formInput]="form.get('email')" placeholder="E-mail">
<span note>Please leave us your E-mail to notify you about the reporting status.</span>
</div>
<div class="uk-width-auto">

View File

@ -641,14 +641,19 @@ export class ParsingFunctions {
}
classifiedSubjects.get(this.notebook_label).push(this.notebook_value);
} else {
if (otherSubjects == undefined) {
otherSubjects = new Map<string, string[]>();
}
// if (otherSubjects == undefined) {
// otherSubjects = new Map<string, string[]>();
// }
//
// if (!otherSubjects.has(subject.classname)) {
// otherSubjects.set(subject.classname, new Array<string>());
// }
// otherSubjects.get(classname).push(content);
if (!otherSubjects.has(subject.classname)) {
otherSubjects.set(subject.classname, new Array<string>());
if (subjects == undefined) {
subjects = new Array<string>();
}
otherSubjects.get(classname).push(content);
subjects.push(content);
}
}
}

View File

@ -47,9 +47,8 @@ import {properties} from "../../../../environments/environment";
<a (click)="openIdentifiersModal()">View all</a>
</div>
<modal-alert #identifiersModal [classTitle]="'landing-modal-header'"
[classBody]="'landing-modal uk-padding-remove'">
<div class="uk-padding uk-padding-remove-top uk-text-small">
<modal-alert #identifiersModal>
<div class="uk-text-small">
<ng-container *ngTemplateOutlet="identifiers_template; context: { modal: true}"></ng-container>
</div>
</modal-alert>

View File

@ -1,46 +1,69 @@
import {Component, Input} from '@angular/core';
import {
ChangeDetectorRef,
Component,
ElementRef,
HostListener,
Input,
QueryList,
ViewChild,
ViewChildren
} from '@angular/core';
import {properties} from "../../../../environments/environment";
@Component({
selector: 'showSubjects',
template: `
<div class="uk-text-muted">
Subjects
</div>
<div class="uk-margin-small-top">
<div>
<ng-container *ngIf="classifiedSubjects && classifiedSubjects.size > 0">
<div *ngFor="let key of getKeys(classifiedSubjects)" style="line-height: 20px">
<span uk-icon="tag"></span>
<span class="uk-text-bold"> {{key}}: </span>
<ng-container *ngFor="let subject of classifiedSubjects.get(key)">
<span class="uk-display-inline-block label-classified">
<span *ngIf="specialSubjects.indexOf(subject) == -1 ">{{subject}}</span>
<a class="uk-link-reset" *ngIf="specialSubjects.indexOf(subject) != -1"
[routerLink]=" properties.searchLinkToAdvancedResults"
[queryParams]="getSubjectParameter(subject)" >
{{subject}}
</a>
</span>
</ng-container>
</div>
</ng-container>
<div *ngIf="(subjects && subjects.length > 0) || (otherSubjects && otherSubjects.size > 0)" class="uk-text-break">
<span uk-icon="tag"></span>
<span class="uk-text-bold"> free text keywords: </span>
<span *ngIf="subjects && subjects.length > 0">{{subjects.join(', ')}}</span>
<span *ngIf="(subjects && subjects.length > 0) && (otherSubjects && otherSubjects.size > 0)">, </span>
<span *ngIf="otherSubjects && otherSubjects.size > 0">
<span *ngFor="let key of getKeys(otherSubjects); let i=index">
<span *ngIf="otherSubjects.get(key).length > 0">
<span>{{otherSubjects.get(key).join(', ')}}</span>
<span *ngIf="i < (otherSubjects.size - 1)">, </span>
</span>
</span>
</span>
</div>
template: `
<ng-container *ngIf="classifiedSubjects && classifiedSubjects.size > 0">
<div class="uk-text-meta uk-margin-small-bottom">
Subjects by Vocabulary
</div>
</div>
<div *ngFor="let key of getKeys(classifiedSubjects)" class="uk-grid uk-grid-small uk-flex-middle" uk-grid>
<span>
<span uk-icon="tag"></span>
<span class="uk-text-bold uk-margin-small-right"> {{key}}: </span>
</span>
<span *ngFor="let subject of classifiedSubjects.get(key)" class="uk-width-auto uk-flex">
<span class="uk-border-rounded uk-label uk-label-small uk-label-primary uk-text-truncate">
<span *ngIf="specialSubjects.indexOf(subject) == -1 ">{{subject}}</span>
<a class="uk-link-reset" *ngIf="specialSubjects.indexOf(subject) != -1"
[routerLink]=" properties.searchLinkToAdvancedResults"
[queryParams]="getSubjectParameter(subject)">
{{subject}}
</a>
</span>
</span>
</div>
</ng-container>
<ng-container *ngIf="(subjects && subjects.length > 0) || (otherSubjects && otherSubjects.size > 0)">
<div class="uk-text-meta uk-margin-small-bottom" [class.uk-margin-medium-top]="classifiedSubjects && classifiedSubjects.size > 0">
Subjects
</div>
<ng-container *ngTemplateOutlet="subjects_template; context: {customClasses: 'multi-line-ellipsis lines-2', id: 'content'}"></ng-container>
<div *ngIf="isLarge" class="uk-text-right uk-margin-small-top">
<a (click)="openSubjectsModal()">View all</a>
</div>
</ng-container>
<ng-template #subjects_template let-customClasses="customClasses" let-id="id">
<div class="uk-text-break" [ngClass]="customClasses">
<p *ngIf="subjects && subjects.length > 0"><span #content [id]="id">{{subjects.join(', ')}}</span></p>
<!-- <span *ngIf="(subjects && subjects.length > 0) && (otherSubjects && otherSubjects.size > 0)">, </span>-->
<!-- <span *ngIf="otherSubjects && otherSubjects.size > 0">-->
<!-- <span *ngFor="let key of getKeys(otherSubjects); let i=index">-->
<!-- <span *ngIf="otherSubjects.get(key).length > 0">-->
<!-- <span>{{otherSubjects.get(key).join(', ')}}</span>-->
<!-- <span *ngIf="i < (otherSubjects.size - 1)">, </span>-->
<!-- </span>-->
<!-- </span>-->
<!-- </span>-->
</div>
</ng-template>
<modal-alert #subjectsModal>
<div class="uk-text-small">
<ng-container *ngTemplateOutlet="subjects_template"></ng-container>
</div>
</modal-alert>
`
})
@ -48,10 +71,18 @@ export class ShowSubjectsComponent {
@Input() subjects: string[];
@Input() otherSubjects: Map<string, string[]>;
@Input() classifiedSubjects: Map<string, string[]>;
isLarge: boolean = false;
properties = properties;
specialSubjects = [];
@ViewChildren("content", { read: ElementRef }) content: QueryList<ElementRef>;
@ViewChild('subjectsModal') subjectsModal;
constructor() {
@HostListener('window:resize', ['$event'])
onResize(event) {
this.checkLarge();
}
constructor(private cdr: ChangeDetectorRef) {
if(properties.dashboard == "explore") {
this.specialSubjects = [
// "Physics::Optics",
@ -79,10 +110,30 @@ export class ShowSubjectsComponent {
ngOnInit() {
}
ngAfterViewInit() {
this.checkLarge();
}
checkLarge() {
let overflow = 42;
if(typeof document !== "undefined" && this.content) {
let element = this.content.find(content => content.nativeElement.id === "content");
this.isLarge = (element && element.nativeElement.offsetHeight > overflow);
this.cdr.detectChanges();
}
}
public getKeys(map) {
return Array.from(map.keys());
}
getSubjectParameter(param){
return {'f0':'resultsubject','fv0':'"' +(param)+'"', size:50};
}
public openSubjectsModal() {
this.subjectsModal.cancelButton = false;
this.subjectsModal.okButton = false;
this.subjectsModal.alertTitle = "Subjects";
this.subjectsModal.open();
}
}

View File

@ -1,14 +1,22 @@
<div id="tm-main" class="landing uk-section uk-padding-remove-top tm-middle">
<div id="tm-main" class="landing uk-section uk-padding-remove tm-middle">
<div class="tm-main">
<div *ngIf="errorMessage.length > 0 || showLoading" class="landing-background-default-color">
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-margin-large-top"
role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
</div>
<div *ngIf="resultLandingInfo" class="publication">
<div *ngIf="!showFeedback" class="uk-grid">
<!-- left box - actions -->
<div class="uk-width-small landing-background-light-color">
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-column-height landing-left-column-border uk-sticky"
<div class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color">
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky"
uk-sticky="bottom: true" [attr.offset]="offset">
<div [class.uk-hidden]="!hasAltMetrics && !metricsCalculated"
class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
<!-- [class.uk-hidden]="!hasAltMetrics && !metricsCalculated"-->
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
<ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)">
<metrics *ngIf="hasMetrics" class="uk-margin-bottom"
[pageViews]="pageViews"
@ -23,11 +31,15 @@
<div class="uk-text-meta">Actions</div>
<ul class="uk-list">
<!-- Share -->
<!-- <li>-->
<!-- social-->
<!-- &lt;!&ndash; TODO: MOVE SOCIAL TO MODAL OR DROP!!!! &ndash;&gt;-->
<!-- &lt;!&ndash; <addThis></addThis>&ndash;&gt;-->
<!-- </li>-->
<li class="uk-text-center">
<a (click)="openAddThisModal()"
[title]="'Share this '+getTypeName() + ' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon>
</span>
</a>
</li>
<!-- Link to -->
<li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center"
[title]="'Link this '+getTypeName()+' to...'"
@ -35,7 +47,7 @@
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="link"></icon>
<icon name="link" visuallyHidden="link"></icon>
</span>
</a>
</li>
@ -45,14 +57,7 @@
[title]="'Cite this '+getTypeName()"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<svg width="20"
height="20"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
data-svg="quote-right">
<path d="M17.27,7.79 C17.27,9.45 16.97,10.43 15.99,12.02 C14.98,13.64 13,15.23 11.56,15.97 L11.1,15.08 C12.34,14.2 13.14,13.51 14.02,11.82 C14.27,11.34 14.41,10.92 14.49,10.54 C14.3,10.58 14.09,10.6 13.88,10.6 C12.06,10.6 10.59,9.12 10.59,7.3 C10.59,5.48 12.06,4 13.88,4 C15.39,4 16.67,5.02 17.05,6.42 C17.19,6.82 17.27,7.27 17.27,7.79 L17.27,7.79 Z"></path>
<path d="M8.68,7.79 C8.68,9.45 8.38,10.43 7.4,12.02 C6.39,13.64 4.41,15.23 2.97,15.97 L2.51,15.08 C3.75,14.2 4.55,13.51 5.43,11.82 C5.68,11.34 5.82,10.92 5.9,10.54 C5.71,10.58 5.5,10.6 5.29,10.6 C3.47,10.6 2,9.12 2,7.3 C2,5.48 3.47,4 5.29,4 C6.8,4 8.08,5.02 8.46,6.42 C8.6,6.82 8.68,7.27 8.68,7.79 L8.68,7.79 Z"></path>
</svg>
<icon name="quotes" visuallyHidden="cite"></icon>
</span>
</a>
</li>
@ -84,12 +89,38 @@
</div>
<!-- center box-->
<div *ngIf="resultLandingInfo" class="uk-width-expand uk-padding-remove landing-background-default-color">
<!-- uk-sticky="bottom: true; offset: 90vh;"-->
<div class="uk-padding-large uk-padding-remove-vertical uk-margin-medium-top">
<div *ngIf="resultLandingInfo" class="uk-width-expand uk-padding-remove uk-margin-large-left uk-margin-large-right landing-background-default-color">
<ng-template #graph_and_feedback_template>
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2 graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="uk-text-primary">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<!--Feedback-->
<div class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">Anything wrong?</span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall"> Report an Issue</a>
</div>
</div>
</ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-text-xsmall uk-visible@m" uk-sticky="bottom: true;" [attr.offset]="calcGraphOffset()">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div>
<div class="uk-margin-medium-top">
<!-- schema.org-->
<schema2jsonld *ngIf="resultLandingInfo.record" [data]=resultLandingInfo.record
[URL]="canonicalUrl"></schema2jsonld>
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
[texts]="pageContents['top']"></helper>
<span *ngIf="resultLandingInfo.deletedByInferenceIds" class="uk-text-primary uk-flex uk-flex-middle">
<icon flex="true" ratio="0.8" name="auto_awesome_motion"></icon>
<a (click)="openDeletedByInference()" class="uk-text-primary uk-text-small uk-margin-small-left">
@ -144,14 +175,12 @@
</div>
</div>
<div id="main-tabs-div" class="uk-padding-large uk-padding-remove-vertical"
uk-sticky="bottom: true; offset: 0"
<div id="main-tabs-div"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset"
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<div [ngStyle]="{'padding-top': offset+'px'}">
<showTitle *ngIf="stickyHeader" [titleName]="resultLandingInfo.title" classNames="uk-margin-remove-bottom"></showTitle>
</div>
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [(isSticky)]="stickyHeader">
<showTitle *ngIf="stickyHeader" [titleName]="resultLandingInfo.title" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
<my-tab tabTitle="Summary" [tabId]="'summary'" [active]="true"></my-tab>
<my-tab *ngIf="resultLandingInfo.references && resultLandingInfo.references.length > 0"
[tabTitle]="'References'" [tabId]="'references'"
@ -172,11 +201,11 @@
</div>
</div>
<div id="landing-sections" class="uk-padding-large uk-padding-remove-vertical">
<div id="landing-sections" class="uk-text-small">
<ng-container>
<div id="summary" class="landing-section uk-padding uk-padding-remove-horizontal">
<div *ngIf="!hasPrimaryInfo" class="uk-height-small uk-flex uk-flex-center uk-flex-middle">
<div class="uk-animation-fade uk-alert uk-alert-primary" role="alert">
<div class="uk-animation-fade uk-text-meta uk-text-large">
No summary information available
</div>
</div>
@ -203,49 +232,29 @@
<!-- Related Organizations-->
<div *ngIf="resultLandingInfo.organizations && resultLandingInfo.organizations.length > 0"
class="uk-margin-medium-bottom uk-width-2-3@m">
<div class="uk-text-meta">Related {{openaireEntities.ORGANIZATIONS}}</div>
<ul class="uk-list organizations uk-margin-remove-top">
<li *ngFor="let organization of (showAll?resultLandingInfo.organizations:resultLandingInfo.organizations.slice(0,3))">
<a [routerLink]="properties.searchLinkToOrganization.split('?')[0]" [queryParams]="{organizationId: organization.id}">
{{(organization.name ? organization.name : (organization.shortname?organization.shortname:'[No title available]'))}}
<span *ngIf="!organization.name && organization.shortname">({{organization.shortname}})</span>
</a>
<div *ngIf="organization.country && !organization.country.toLowerCase().includes('unknown')">{{organization.country}}</div>
</li>
</ul>
<div *ngIf="!showAll && resultLandingInfo.organizations.length > 3" class="uk-text-center">
<a (click)="showAll = !showAll;">
<div class="uk-text-meta uk-margin-small-bottom">Related {{openaireEntities.ORGANIZATIONS}}</div>
<ng-container *ngTemplateOutlet="organizations_template; context: { threshold: lessBtnOrganizations ? resultLandingInfo.organizations.length : thresholdOrganizations }"></ng-container>
<div *ngIf="resultLandingInfo.organizations.length > thresholdOrganizations && !lessBtnOrganizations"
class="uk-text-center">
<a (click)="viewAllOrganizationsClick();">
View more
</a>
</div>
<div *ngIf="showAll && resultLandingInfo.organizations.length > 3" class="uk-text-center">
<a (click)="showAll = !showAll;">View less</a>
<div *ngIf="viewAllOrganizations && lessBtnOrganizations" class="uk-text-center">
<a (click)="viewAllOrganizations = !viewAllOrganizations; lessBtnOrganizations=false;">View less</a>
</div>
</div>
</div>
<div *ngIf="hasSecondaryInfo" class="uk-width-1-3@m uk-width-1-1 right-column uk-padding-remove">
<div *ngIf="resultLandingInfo.fundedByProjects && resultLandingInfo.fundedByProjects.length > 0 ||
resultLandingInfo.contexts && resultLandingInfo.contexts.length >0">
</div>
</div>
<div *ngIf="!hasPrimaryInfo && !hasSecondaryInfo"
class="uk-width-expand uk-padding">
<div class="uk-animation-fade uk-alert uk-alert-primary" role="alert">
No summary information available
</div>
</div>
</div>
</ng-container>
<ng-container *ngIf="resultLandingInfo.references && resultLandingInfo.references.length > 0">
<div id="references" class="landing-section uk-padding uk-padding-remove-horizontal">
<no-load-paging *ngIf="resultLandingInfo.references.length > 1.5*pageSize" [type]="'references'"
(pageChange)="updateReferencesPage($event)"
[page]="referencesPage" [pageSize]="1.5*pageSize"
<results-and-pages *ngIf="resultLandingInfo.references.length > pageSize" [type]="'references'"
[page]="referencesPage" [pageSize]="pageSize"
[totalResults]="resultLandingInfo.references.length">
</no-load-paging>
</results-and-pages>
<div
*ngFor="let item of resultLandingInfo.references.slice((referencesPage-1)*1.5*pageSize, referencesPage*1.5*pageSize)">
*ngFor="let item of resultLandingInfo.references.slice((referencesPage-1)*pageSize, referencesPage*pageSize)">
<p *ngIf="item">
{{item.name}}
<ng-container *ngIf="item.ids && item.ids.length > 0">
@ -259,11 +268,11 @@
</ng-container>
</p>
</div>
<no-load-paging *ngIf="resultLandingInfo.references.length > 1.5*pageSize" [type]="'references'"
<paging-no-load *ngIf="resultLandingInfo.references.length > pageSize"
(pageChange)="updateReferencesPage($event)"
[page]="referencesPage" [pageSize]="1.5*pageSize"
[currentPage]="referencesPage" [size]="pageSize"
[totalResults]="resultLandingInfo.references.length">
</no-load-paging>
</paging-no-load>
</div>
</ng-container>
<ng-container *ngIf="resultLandingInfo.relatedResults?.length > 0">
@ -273,32 +282,33 @@
</ng-container>
<ng-container *ngIf="resultLandingInfo.bioentities && bioentitiesNum> 0">
<div id="bioentities" class="landing-section uk-padding uk-padding-remove-horizontal">
<no-load-paging *ngIf="bioentitiesNum > 2*pageSize" [type]="'bioentities'"
(pageChange)="updateBioentitiesPage($event)"
<results-and-pages *ngIf="bioentitiesNum > 2*pageSize" [type]="'bioentities'"
[page]="bioentitiesPage" [pageSize]="2*pageSize"
[totalResults]="bioentitiesNum">
</no-load-paging>
<div class="uk-child-width-1-4@s uk-child-width-1-2 bioentities-buttons" uk-grid>
</results-and-pages>
<div class="uk-text-center uk-child-width-1-4@s uk-child-width-1-2 uk-grid uk-grid-medium uk-margin-bottom" uk-grid>
<ng-container *ngFor="let key of getKeys(resultLandingInfo.bioentities) let i=index">
<ng-container
*ngFor="let keyIn of keysToArray(resultLandingInfo.bioentities.get(key)).slice((bioentitiesPage-1)*2*pageSize, bioentitiesPage*2*pageSize)">
<div>
<div [title]="key" *ngIf="keyIn && !resultLandingInfo.bioentities.get(key).get(keyIn)">
<div [title]="key" *ngIf="keyIn && !resultLandingInfo.bioentities.get(key).get(keyIn)"
class="uk-card uk-card-default uk-card-body">
{{keyIn}}
</div>
<a [href]="resultLandingInfo.bioentities.get(key).get(keyIn)" target="_blank" class="custom-external"
[title]="key" *ngIf="keyIn && resultLandingInfo.bioentities.get(key).get(keyIn)">
<a [href]="resultLandingInfo.bioentities.get(key).get(keyIn)" target="_blank"
[title]="key" *ngIf="keyIn && resultLandingInfo.bioentities.get(key).get(keyIn)"
class="uk-card uk-card-default uk-card-hover uk-card-body custom-external">
{{keyIn}}
</a>
</div>
</ng-container>
</ng-container>
</div>
<no-load-paging *ngIf="bioentitiesNum > 2*pageSize" [type]="'bioentities'"
<paging-no-load *ngIf="bioentitiesNum > 2*pageSize"
(pageChange)="updateBioentitiesPage($event)"
[page]="bioentitiesPage" [pageSize]="2*pageSize"
[currentPage]="bioentitiesPage" [size]="2*pageSize"
[totalResults]="bioentitiesNum">
</no-load-paging>
</paging-no-load>
</div>
</ng-container>
<ng-container *ngIf="enermapsId && properties.enermapsURL">
@ -332,45 +342,54 @@
</div>
</ng-container>
</div>
<div class="uk-text-xsmall uk-hidden@m"><ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container></div>
<div class="uk-margin-small-top uk-flex" uk-sticky="bottom: true" [attr.offset]="offset">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2">
<img src="assets/common-assets/graph.svg" style="opacity: 0.4; width:18px; height:20px" loading="lazy" alt="graph">
<span class="uk-margin-small-left uk-text-baseline uk-text-meta uk-text-xsmall">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="graph">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-text-xsmall">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<!--Feedback-->
<div class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">Anything wrong?</span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall"> Report an Issue</a>
</div>
</div>
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
[texts]="pageContents['bottom']"></helper>
</div>
<!-- right box-->
<div *ngIf="resultLandingInfo"
class="uk-width-1-3 uk-width-1-4@l uk-padding-remove landing-background-grey-color uk-text-small" [class.uk-animation-right]="viewAll">
<div class="uk-sticky uk-overflow-auto landing-column-height" uk-sticky="bottom: true" [attr.offset]="offset">
<ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo">
<div id="right-sidebar-switcher" uk-toggle href="#right-column-offcanvas"
class="offcanvas-switcher uk-flex uk-flex-center uk-flex-middle uk-hidden@m"
(click)="rightSidebarOffcanvasClicked = true;">
<icon name="more" ratio="1.5" customClass="uk-text-primary" flex="true" visuallyHidden="sidebar"></icon>
</div>
<div id="right-column-offcanvas" class="uk-offcanvas offcanvas" uk-offcanvas="flip: true; overlay: true;">
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close offcanvas-close uk-close uk-icon" type="button">
<icon name="close" ratio="1.5" visuallyHidden="close"></icon>
</button>
<div *ngIf="rightSidebarOffcanvasClicked" class="uk-padding">
<ng-container *ngTemplateOutlet="right_column"></ng-container>
</div>
</div>
</div>
<div *ngIf="!rightSidebarOffcanvasClicked" class="uk-width-1-3 uk-width-1-4@l uk-padding-remove landing-background-grey-color uk-text-small uk-visible@m"
[class.uk-animation-right]="viewAll">
<div class="uk-sticky uk-overflow-auto landing-sidebar-height" uk-sticky="bottom: true" [attr.offset]="offset">
<ng-container *ngTemplateOutlet="right_column"></ng-container>
</div>
</div>
<ng-template #right_column>
<div class="uk-margin-medium-top uk-list uk-list-large uk-padding uk-padding-remove-vertical" [class.uk-list-divider]="!viewAll">
<!-- EGI Notebook-->
<!-- EGI Notebook-->
<div *ngIf="resultLandingInfo.showEgiNotebookButton && properties.adminToolsPortalType == 'explore'
&& (properties.environment == 'beta' || properties.environment == 'development') && (!viewAll || viewAll=='egiNotebook')">
&& (properties.environment == 'beta' || properties.environment == 'development') && (!viewAll || viewAll=='egiNotebook')">
<a class="uk-link-text uk-text-bold custom-external"
target="_blank" [href]="properties.egiNotebookLink">
<!-- <span class="uk-icon-button uk-icon">-->
<img src="assets/common-assets/eosc-logo.png"
loading="lazy" alt="eosc_logo" style="width:27px; height:27px">
<!-- </span>-->
<!-- <span class="uk-icon-button uk-icon">-->
<img src="assets/common-assets/eosc-logo.png"
loading="lazy" alt="eosc_logo" style="width:27px; height:27px">
<!-- </span>-->
<span class="uk-margin-small-left uk-text-uppercase"><u>EOSC SERVICE: EGI NOTEBOOK</u></span>
</a>
</div>
<!-- <hr *ngIf="resultLandingInfo.showEgiNotebookButton && properties.adminToolsPortalType == 'explore'-->
<!-- && (properties.environment == 'beta' || properties.environment == 'development')">-->
<!-- <hr *ngIf="resultLandingInfo.showEgiNotebookButton && properties.adminToolsPortalType == 'explore'-->
<!-- && (properties.environment == 'beta' || properties.environment == 'development')">-->
<div *ngIf="resultLandingInfo.sdg && resultLandingInfo.sdg.length > 0 && (!viewAll || viewAll=='sdg')">
<sdg [subjects]="resultLandingInfo.sdg" (viewAllClicked)="viewAll=$event"></sdg>
</div>
@ -381,73 +400,39 @@
<div *ngIf="resultLandingInfo.fundedByProjects && resultLandingInfo.fundedByProjects.length > 0 && (!viewAll || viewAll=='fundedBy')">
<fundedBy [fundedByProjects]="resultLandingInfo.fundedByProjects" (viewAllClicked)="viewAll=$event"></fundedBy>
</div>
<!-- <hr *ngIf="resultLandingInfo.fundedByProjects && resultLandingInfo.fundedByProjects.length > 0">-->
<!-- <hr *ngIf="resultLandingInfo.fundedByProjects && resultLandingInfo.fundedByProjects.length > 0">-->
<!-- Communities -->
<div *ngIf="resultLandingInfo.contexts && resultLandingInfo.contexts.length > 0 && !noCommunities && (!viewAll || viewAll=='relatedTo')">
<relatedTo [contexts]="resultLandingInfo.contexts" [viewAll]="viewAll=='relatedTo'"
(viewAllClicked)="viewAll=$event" (noCommunities)="noCommunities = true"></relatedTo>
</div>
<!-- <hr *ngIf="resultLandingInfo.contexts && resultLandingInfo.contexts.length > 0"-->
<!-- <hr *ngIf="resultLandingInfo.contexts && resultLandingInfo.contexts.length > 0"-->
<!-- Download From -->
<div *ngIf="resultLandingInfo.hostedBy_collectedFrom && resultLandingInfo.hostedBy_collectedFrom.length > 0 && (!viewAll || viewAll=='availableOn')">
<!-- <div class="uk-inline">-->
<!-- <button class="uk-button uk-button-default" type="button">Click</button>-->
<!-- <div uk-dropdown="mode: click">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</div>-->
<!-- </div>-->
<!-- <div class="uk-inline">-->
<!-- <button class="uk-button uk-button-default" type="button">Click</button>-->
<!-- <div uk-dropdown="mode: click">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.</div>-->
<!-- </div>-->
<!-- <div class="uk-button uk-button-default button-drop uk-width-1-1">Select a source...</div>-->
<!-- <div class="uk-button uk-button-default button-drop uk-width-1-1">Select a source...</div>-->
<availableOn [availableOn]="resultLandingInfo.hostedBy_collectedFrom" (viewAllClicked)="viewAll=$event"></availableOn>
</div>
<!-- style="border: 1px solid red">-->
<!-- <div *ngFor="let item of fakeArray.slice(0, 50); let i=index">test3.{{i}}</div>-->
<!-- style="border: 1px solid red">-->
<!-- <div *ngFor="let item of fakeArray.slice(0, 50); let i=index">test3.{{i}}</div>-->
</div>
</div>
</div>
</ng-template>
</ng-container>
</div>
</div>
</div>
<div *ngIf="!showFeedback" class="uk-grid">
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
<div class="uk-container uk-container-large uk-margin-medium-top publication">
<div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-margin-large-top"
role="alert">{{warningMessage}}</div>
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-margin-large-top"
role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
[texts]="pageContents['top']"></helper>
<div *ngIf="resultLandingInfo" class="uk-grid uk-margin-remove">
<div
class="uk-width-2-3@m uk-width-1-1@s uk-padding uk-padding-remove-left uk-padding-remove-vertical uk-margin-bottom">
</div>
<div class="uk-width-1-3@m uk-width-1-1@s uk-padding-remove">
</div>
<!-- *ngIf="numberOfTabs > 0"-->
<!-- <div class="uk-padding-remove-left uk-width-1-1 uk-margin-medium-top">-->
<!-- &lt;!&ndash; B2 Note&ndash;&gt;-->
<!-- <div *ngIf="properties.b2noteAPIURL && resultLandingInfo" class="uk-margin-medium-top">-->
<!-- <b2note #annotation [id]="id" [landingInfo]="resultLandingInfo" (pidEmitter)="pidInit($event)"></b2note>-->
<!-- </div>-->
<!-- </div>-->
</div>
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
[texts]="pageContents['bottom']"></helper>
</div>
</div>
</div>
<feedback *ngIf="resultLandingInfo && properties.reCaptchaSiteKey" [resultLandingInfo]="resultLandingInfo"
[properties]="properties" [entityType]="getTypeName()" [fields]="feedbackFields"
[showForm]="showFeedback" (show)="showFeedback = $event;"></feedback>
[(showForm)]="showFeedback"></feedback>
</div>
<!-- Other versions -->
<modal-alert *ngIf="resultLandingInfo && resultLandingInfo.deletedByInferenceIds"
#AlertModalDeletedByInference classBody="uk-width-xxlarge uk-padding-remove"
classTitle="landing-modal-header">
#AlertModalDeletedByInference large="true">
<!-- <landing-header [properties]="properties" [title]="resultLandingInfo.title" [modal]="AlertModalDeletedByInference"-->
<!-- [subTitle]="resultLandingInfo.subtitle" [authorLimit]="10" [showAllAuthors]="false"-->
<!-- titleClass="title-grey-background"-->
@ -455,7 +440,6 @@
<!-- [year]="resultLandingInfo.date" [embargoEndDate]="resultLandingInfo.embargoEndDate"-->
<!-- [isTitleH1]="false">-->
<!-- </landing-header>-->
<div class="uk-padding">
<deletedByInference *ngIf="type == 'publication' && deleteByInferenceOpened"
[id]="resultLandingInfo.record['result']['header']['dri:objIdentifier']"
[ids]="resultLandingInfo.deletedByInferenceIds"
@ -476,14 +460,32 @@
[ids]="resultLandingInfo.deletedByInferenceIds"
[modal]="AlertModalDeletedByInference"
[resultType]="'other'" [type]="'other research products'"></deletedByInference>
</div>
</modal-alert>
<modal-alert #citeModal [classTitle]="'landing-modal-header'"
[classBody]="'uk-padding-remove landing-modal'">
<citeThis *ngIf="resultLandingInfo && citeThisClicked" [result]="resultLandingInfo" [id]="id"
<modal-alert *ngIf="resultLandingInfo" #citeModal>
<citeThis *ngIf="citeThisClicked" [result]="resultLandingInfo" [id]="id"
[type]="title.toLowerCase()" [piwikSiteId]="piwikSiteId"></citeThis>
</modal-alert>
<modal-alert *ngIf="resultLandingInfo"
#addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
<addThis></addThis>
</modal-alert>
<modal-alert *ngIf="resultLandingInfo && resultLandingInfo.organizations" #organizationsModal>
<ng-container *ngTemplateOutlet="organizations_template; context: { threshold: resultLandingInfo.organizations.length}"></ng-container>
</modal-alert>
<ng-template #organizations_template let-threshold="threshold">
<ul class="uk-list organizations uk-margin-remove-top">
<li *ngFor="let organization of resultLandingInfo.organizations.slice(0, threshold)" class="uk-tile uk-tile-default uk-padding-small">
<a [routerLink]="properties.searchLinkToOrganization.split('?')[0]" [queryParams]="{organizationId: organization.id}" class="uk-link-text uk-text-bold">
{{(organization.name ? organization.name : (organization.shortname?organization.shortname:'[No title available]'))}}
<span *ngIf="!organization.name && organization.shortname">({{organization.shortname}})</span>
</a>
<div *ngIf="organization.country && !organization.country.toLowerCase().includes('unknown')" class="uk-text-xsmall uk-text-muted">{{organization.country}}</div>
</li>
</ul>
</ng-template>
<ng-template #relation_in_tab let-researchResults="researchResults" let-header="header" let-relatedClassFilters="relatedClassFilters">
<div
@ -500,12 +502,11 @@
<mat-option *ngFor="let relatedClass of relatedClassFilters" [value]="relatedClass">{{relatedClass}}</mat-option>
</mat-select>
</mat-form-field>
<no-load-paging
<results-and-pages
[type]="'research outcomes'"
(pageChange)="updateRelatedPage($event)"
[page]="relatedPage" [pageSize]="pageSize"
[totalResults]="researchResults.length">
</no-load-paging>
</results-and-pages>
<ul class="uk-list uk-list-divider uk-margin">
<li *ngFor="let item of researchResults.slice((relatedPage-1)*pageSize, relatedPage*pageSize)">
<result-preview [modal]="relationModal" [properties]="properties"
@ -513,11 +514,11 @@
[isCard]="false"></result-preview>
</li>
</ul>
<no-load-paging *ngIf="researchResults.length > pageSize"
[type]="'research outcomes'"
<paging-no-load *ngIf="researchResults.length > pageSize"
class="uk-margin-top"
(pageChange)="updateRelatedPage($event)"
[page]="relatedPage" [pageSize]="pageSize"
[currentPage]="relatedPage" [size]="pageSize"
[totalResults]="researchResults.length">
</no-load-paging>
</paging-no-load>
</div>
</ng-template>

View File

@ -38,9 +38,9 @@ export class ResultLandingComponent {
enermapsId;
@ViewChild('linkModal') linkModal;
@ViewChild('citeModal') citeModal;
@ViewChild('addThisModal') addThisModal;
@ViewChild('AlertModalDeletedByInference') alertModalDeletedByInference;
@ViewChild('relationModal') relationModal;
@ViewChild('organizationModal') organizationModal;
public deleteByInferenceOpened: boolean = false;
@Input() public resultFromInput: boolean = false;
@Input() public resultLandingInfo: ResultLandingInfo;
@ -50,7 +50,11 @@ export class ResultLandingComponent {
public title: string;
/*Show all organizations*/
public showAll: boolean = false;
public viewAllOrganizations: boolean = false;
public lessBtnOrganizations: boolean = false;
public thresholdOrganizations: number = 5;
@ViewChild('organizationsModal') organizationsModal;
// Links for SEO
public linkToLandingPage: string = null;
@ -84,7 +88,6 @@ export class ResultLandingComponent {
public relatedResultsNum: number = 0;
// Message variables
public warningMessage = "";
public errorMessage = "";
public showLoading: boolean = true;
@ -120,12 +123,15 @@ export class ResultLandingComponent {
public filteredRelatedResults: RelationResult[];
public offset: number;
@ViewChild("graph_and_feedback") graph_and_feedback;
public viewAll: string = "";
public noCommunities: boolean = false;
public stickyHeader: boolean = false;
public rightSidebarOffcanvasClicked: boolean = false;
constructor(private _resultLandingService: ResultLandingService,
private _vocabulariesService: ISVocabulariesService,
private _piwikService: PiwikService,
@ -209,6 +215,13 @@ export class ResultLandingComponent {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--navbar-height'));
}
calcGraphOffset() {
if(this.graph_and_feedback && window) {
return window.innerHeight-this.graph_and_feedback.nativeElement.offsetHeight+"px";
}
return 0;
}
private initMetaAndLinks(type: string) {
if (type == "publication") {
this.type = "publication";
@ -311,7 +324,6 @@ export class ResultLandingComponent {
}
private getProvenanceVocabularyAndResultLandingInfo() {
this.warningMessage = '';
this.errorMessage = '';
this.showLoading = true;
@ -331,7 +343,7 @@ export class ResultLandingComponent {
}
private setActiveTab() {
if (this.hasPrimaryInfo || this.hasSecondaryInfo) {
if (this.hasPrimaryInfo) {
this.activeTab = 'summary';
} else if (this.resultLandingInfo.references && this.resultLandingInfo.references.length > 0) {
this.activeTab = 'references';
@ -443,6 +455,8 @@ export class ResultLandingComponent {
this.showLoading = false;
this.setActiveTab();
this.cdr.detectChanges();
},
err => {
this.handleError("Error getting " + this.type + " for " + (this.id ? ("id: " + this.id) : ("pid: " + this.identifier.id + " ("+this.identifier.class+")")), err);
@ -474,13 +488,22 @@ export class ResultLandingComponent {
public get hasPrimaryInfo(): boolean {
return !!this.resultLandingInfo && (
(!!this.resultLandingInfo.description && this.resultLandingInfo.description.length > 0)
|| !!this.resultLandingInfo.identifiers || !!this.resultLandingInfo.subjects
|| !!this.resultLandingInfo.subjects
|| (!!this.resultLandingInfo.organizations && this.resultLandingInfo.organizations.length > 0));
}
public get hasSecondaryInfo(): boolean {
return (this.resultLandingInfo.fundedByProjects && this.resultLandingInfo.fundedByProjects.length > 0) ||
(this.resultLandingInfo.contexts && this.resultLandingInfo.contexts.length > 0) ||
public get hasRightSidebarInfo(): boolean {
return (this.resultLandingInfo.showEgiNotebookButton && properties.adminToolsPortalType == 'explore'
&& (properties.environment == 'beta' || properties.environment == 'development'))
||
(this.resultLandingInfo.sdg && this.resultLandingInfo.sdg.length > 0)
||
(this.resultLandingInfo.fos && this.resultLandingInfo.fos.length > 0)
||
(this.resultLandingInfo.fundedByProjects && this.resultLandingInfo.fundedByProjects.length > 0)
||
(this.resultLandingInfo.contexts && this.resultLandingInfo.contexts.length > 0 && !this.noCommunities)
||
(this.resultLandingInfo.hostedBy_collectedFrom && this.resultLandingInfo.hostedBy_collectedFrom.length > 0);
}
@ -683,6 +706,14 @@ export class ResultLandingComponent {
this.citeModal.alertTitle = "Cite this " + this.getTypeName();
this.citeModal.open();
}
public openAddThisModal() {
this.addThisModal.cancelButton = false;
this.addThisModal.okButton = false;
this.addThisModal.alertTitle = "Share this " + this.getTypeName() + " in your social networks";
this.addThisModal.open();
}
private addNoIndexFilter() {
let allow = this.checkIfAllowed(this.resultLandingInfo);
if(!allow) {
@ -794,4 +825,20 @@ export class ResultLandingComponent {
this.relatedPage = 1;
this.filteredRelatedResults = this.resultLandingInfo.relatedResults.filter(result => !this.relatedClassSelected || result.relationName.toLowerCase() == this.relatedClassSelected.toLowerCase());
}
public viewAllOrganizationsClick() {
this.viewAllOrganizations = true;
if(this.resultLandingInfo.organizations.length <= this.thresholdOrganizations*2) {
this.lessBtnOrganizations = true;
} else {
this.openOrganizationsModal();
}
}
public openOrganizationsModal() {
this.organizationsModal.cancelButton = false;
this.organizationsModal.okButton = false;
this.organizationsModal.alertTitle = "Related Organizations";
this.organizationsModal.open();
}
}

View File

@ -33,7 +33,7 @@ import {MatFormFieldModule} from "@angular/material/form-field";
import {MatSelectModule} from "@angular/material/select";
import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service";
import {link, orcid_add, orcid_bin} from "../../utils/icons/icons";
import {graph, link, quotes} from "../../utils/icons/icons";
@NgModule({
imports: [
@ -56,6 +56,6 @@ import {link, orcid_add, orcid_bin} from "../../utils/icons/icons";
})
export class ResultLandingModule {
constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([link])
this.iconsService.registerIcons([link, graph, quotes])
}
}

View File

@ -63,8 +63,8 @@ declare var UIkit: any;
[class.uk-disabled]="showLoading || !isLoggedIn || !pids"
[class.uk-text-muted]="!isLoggedIn || !pids"
(mouseover)="hoverEvent($event)" (mouseout)="hoverEvent($event)">
<icon *ngIf="!hoverAdd" name="orcid_add" ratio="1.1"></icon>
<icon *ngIf="hoverAdd" name="add"></icon>
<icon *ngIf="!hoverAdd" name="orcid_add" ratio="1.1" visuallyHidden="add"></icon>
<icon *ngIf="hoverAdd" name="add" visuallyHidden="add"></icon>
</a>
<span *ngIf="showLoading" class="uk-icon icon-button loading-action-button"><loading
[top_margin]="false"></loading></span>
@ -78,36 +78,35 @@ declare var UIkit: any;
[class.uk-disabled]="showLoading || !isLoggedIn || !pids"
[class.uk-text-muted]="!isLoggedIn || !pids"
(mouseover)="hoverEvent($event, 'delete')" (mouseout)="hoverEvent($event, 'delete')">
<icon *ngIf="!hoverDelete" name="orcid_bin" ratio="1.1"></icon>
<icon *ngIf="hoverDelete" name="delete_outline" class="uk-text-danger"></icon>
<icon *ngIf="!hoverDelete" name="orcid_bin" ratio="1.1" visuallyHidden="delete"></icon>
<icon *ngIf="hoverDelete" name="delete_outline" class="uk-text-danger" visuallyHidden="delete"></icon>
</a>
<span *ngIf="showLoading" class="uk-icon icon-button loading-action-button"><loading
[top_margin]="false"></loading></span>
</span>
</ng-container>
<modal-alert #grantModal [classTitle]="'landing-modal-header uk-padding-small'"
[classBody]="'landing-modal uk-padding-remove'">
<div class="uk-text-center uk-padding-small">
<modal-alert #grantModal (alertOutput)="openGrantWindow()">
<div class="uk-text-center">
<div>{{requestGrantMessage}}</div>
<div class="uk-margin-medium-top uk-align-right">
<button (click)="closeGrantModal()" type="submit"
class="uk-button uk-padding-small uk-padding-remove-vertical uk-button-default">
<span>Cancel</span>
</button>
<button (click)="openGrantWindow()" type="submit"
class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left uk-button-primary">
<span>Grant OpenAIRE</span>
</button>
<!-- <div class="uk-margin-medium-top uk-align-right">-->
<!-- <button (click)="closeGrantModal()" type="submit"-->
<!-- class="uk-button uk-padding-small uk-padding-remove-vertical uk-button-default">-->
<!-- <span>Cancel</span>-->
<!-- </button>-->
<!-- <button (click)="openGrantWindow()" type="submit"-->
<!-- class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left orcid-button">-->
<!-- <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="">{{" "}}-->
<!-- <span>Create or Connect your ORCID iD</span>-->
<!-- class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left uk-button-primary">-->
<!-- <span>Grant OpenAIRE</span>-->
<!-- </button>-->
</div>
<!--&lt;!&ndash; <button (click)="openGrantWindow()" type="submit"&ndash;&gt;-->
<!--&lt;!&ndash; class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left orcid-button">&ndash;&gt;-->
<!--&lt;!&ndash; <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="">{{" "}}&ndash;&gt;-->
<!--&lt;!&ndash; <span>Create or Connect your ORCID iD</span>&ndash;&gt;-->
<!--&lt;!&ndash; </button>&ndash;&gt;-->
<!-- </div>-->
</div>
</modal-alert>
@ -164,9 +163,8 @@ declare var UIkit: any;
</span>
</ng-container>
<modal-alert #workModal [classTitle]="'landing-modal-header uk-padding-small'"
[classBody]="'landing-modal uk-padding-remove'">
<div *ngIf="orcidWorks" class="uk-padding-small">
<modal-alert #workModal>
<div *ngIf="orcidWorks">
<div *ngFor="let work of orcidWorks['bulk']">
<ng-container *ngTemplateOutlet="orcidWorkPreview; context:{work: work['work']}"></ng-container>
</div>
@ -263,33 +261,30 @@ declare var UIkit: any;
</div>
</ng-template>
<modal-alert #propagationModal [classTitle]="'landing-modal-header uk-padding-small'"
[classBody]="'landing-modal uk-padding-remove'">
<div class="uk-padding-small">
<div>
This research outcome is the result of <span class="uk-text-bold"> merged research outcomes in OpenAIRE</span>.
<br><br>
You have already added <span class="uk-text-bold">{{this.putCodes?.length}} works</span> in your ORCID record related to the merged research outcome.
<div *ngIf="currentAction == 'delete'">
If you continue with delete action, <span class="uk-text-bold">all these works will be deleted</span>.
</div>
<div *ngIf="currentAction == 'update'">
If you continue with update action, <span class="uk-text-bold">all these works will be deleted and a new merged work will be added</span> instead.
</div>
<modal-alert #propagationModal (alertOutput)="confirmedPropagation()">
<div>
This research outcome is the result of <span class="uk-text-bold"> merged research outcomes in OpenAIRE</span>.
<br><br>
You have already added <span class="uk-text-bold">{{this.putCodes?.length}} works</span> in your ORCID record related to the merged research outcome.
<div *ngIf="currentAction == 'delete'">
If you continue with delete action, <span class="uk-text-bold">all these works will be deleted</span>.
</div>
<div class="uk-margin-medium-top uk-align-right">
<button (click)="closePropagationModal()" type="submit"
class="uk-button uk-padding-small uk-padding-remove-vertical uk-button-default">
<span>Cancel</span>
</button>
<button (click)="confirmedPropagation()" type="submit"
class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left uk-button-primary">
<span>Continue</span>
</button>
<div *ngIf="currentAction == 'update'">
If you continue with update action, <span class="uk-text-bold">all these works will be deleted and a new merged work will be added</span> instead.
</div>
</div>
<!-- <div class="uk-margin-medium-top uk-align-right">-->
<!-- <button (click)="closePropagationModal()" type="submit"-->
<!-- class="uk-button uk-padding-small uk-padding-remove-vertical uk-button-default">-->
<!-- <span>Cancel</span>-->
<!-- </button>-->
<!-- <button (click)="confirmedPropagation()" type="submit"-->
<!-- class="uk-button uk-padding-small uk-padding-remove-vertical uk-margin-left uk-button-primary">-->
<!-- <span>Continue</span>-->
<!-- </button>-->
<!-- </div>-->
</modal-alert>
`
})
@ -690,8 +685,10 @@ export class OrcidWorkComponent {
}
openGrantModal(title: string) {
this.grantModal.cancelButton = false;
this.grantModal.okButton = false;
this.grantModal.cancelButton = true;
this.grantModal.okButton = true;
this.grantModal.okButtonText = "Grant OpenAIRE";
this.grantModal.okButtonLeft = false;
this.grantModal.alertTitle = title;
this.grantModal.open();
}
@ -723,8 +720,10 @@ export class OrcidWorkComponent {
}
openPropagationModal(title: string) {
this.propagationModal.cancelButton = false;
this.propagationModal.okButton = false;
this.propagationModal.cancelButton = true;
this.propagationModal.okButton = true;
this.propagationModal.okButtonText = "Continue";
this.propagationModal.okButtonLeft = false;
this.propagationModal.alertTitle = title;
this.propagationModal.open();
}

View File

@ -3,18 +3,12 @@ import {Component, Input, Output, EventEmitter} from '@angular/core';
@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 uk-child-width-1-1 uk-child-width-1-2@m" uk-grid>
<h6 *ngIf="type && totalResults">
<span>{{totalResults | number}}</span>
<span class="uk-text-muted uk-text-capitalize"> {{type}}, page </span>
<span>{{page}}</span>
<span class="uk-text-muted"> of </span>
<span>{{paging.getTotalPages() | number}}</span>
</h6>
<div class="uk-margin-small-bottom">
<div class="uk-panel uk-grid uk-flex uk-flex-middle uk-child-width-1-1 uk-child-width-1-2@m" uk-grid>
<results-and-pages [type]="type" [page]="page" [pageSize]="pageSize" [totalResults]="totalResults"></results-and-pages>
<div>
<paging-no-load #paging [currentPage]="page"
customClasses="uk-margin-remove-bottom"
customClasses="uk-margin-remove-bottom uk-flex-right"
[totalResults]="totalResults" [size]="pageSize"
(pageChange)="updatePage($event)">
</paging-no-load>

View File

@ -21,7 +21,7 @@
bottom: 0;
left: 0;
width: 100%;
z-index: 100;
z-index: 1000;
font-smooth: always;
-webkit-font-smoothing: antialiased;
text-align: center;

View File

@ -87,7 +87,7 @@ declare var UIkit;
<div class="uk-grid uk-grid-small uk-grid-row-collapse uk-width-expand" uk-grid>
<div *ngFor="let chip of formAsArray.controls; let i=index" [class.uk-hidden]="!focused && i > 0"
class="chip">
<div class="uk-label uk-flex uk-flex-middle">
<div class="uk-label uk-label-small uk-flex uk-flex-middle">
<span class="uk-text-truncate uk-width-expand">{{getLabel(chip.value)}}</span>
<icon (click)="remove(i, $event)" class="uk-link-text uk-margin-small-left clickable" [flex]="true"
name="close" ratio="0.7"></icon>

View File

@ -64,7 +64,7 @@ import {properties} from "../../../../environments/environment";
{{author.fullName}} in OpenAIRE
</div>
<div class="uk-text-center uk-margin-top uk-margin-large-left uk-margin-large-right">
<a class="uk-button uk-button-primary uk-text-bold uk-padding-remove-top uk-padding-remove-bottom"
<a class="uk-button uk-button-primary uk-box-no-shadow uk-text-bold uk-padding-remove-top uk-padding-remove-bottom"
(click)="onClick()"
[queryParams]="routerHelper.createQueryParams(['orcid','oc'],[(author['orcid'] ? author['orcid'] : author['orcid_pending']),'and'])"
routerLinkActive="router-link-active" [routerLink]="properties.searchLinkToAdvancedResults">
@ -89,14 +89,11 @@ import {properties} from "../../../../environments/environment";
<a>View less authors</a>
</div>
<modal-alert #authorsModal [classTitle]="'landing-modal-header'"
[classBody]="'landing-modal uk-padding-remove'">
<div class="uk-padding uk-padding-remove-top uk-overflow-auto">
<span *ngFor="let author of authors; let i=index"
class=" uk-text-small uk-text-emphasis">
<ng-container *ngTemplateOutlet="author_template; context: { author: author, i:i}"></ng-container>
</span>
</div>
<modal-alert #authorsModal>
<span *ngFor="let author of authors; let i=index"
class=" uk-text-small uk-text-emphasis">
<ng-container *ngTemplateOutlet="author_template; context: { author: author, i:i}"></ng-container>
</span>
</modal-alert>
`

View File

@ -221,3 +221,15 @@ export const link = {
}
/** Add new icon under this line to be sure that it will be added on preview */
export const quotes = {
name: 'quotes',
data: '<svg width="20"\n' +
' height="20"\n' +
' viewBox="0 0 20 20"\n' +
' xmlns="http://www.w3.org/2000/svg"\n' +
' data-svg="quote-right">\n' +
' <path d="M17.27,7.79 C17.27,9.45 16.97,10.43 15.99,12.02 C14.98,13.64 13,15.23 11.56,15.97 L11.1,15.08 C12.34,14.2 13.14,13.51 14.02,11.82 C14.27,11.34 14.41,10.92 14.49,10.54 C14.3,10.58 14.09,10.6 13.88,10.6 C12.06,10.6 10.59,9.12 10.59,7.3 C10.59,5.48 12.06,4 13.88,4 C15.39,4 16.67,5.02 17.05,6.42 C17.19,6.82 17.27,7.27 17.27,7.79 L17.27,7.79 Z"></path>\n' +
' <path d="M8.68,7.79 C8.68,9.45 8.38,10.43 7.4,12.02 C6.39,13.64 4.41,15.23 2.97,15.97 L2.51,15.08 C3.75,14.2 4.55,13.51 5.43,11.82 C5.68,11.34 5.82,10.92 5.9,10.54 C5.71,10.58 5.5,10.6 5.29,10.6 C3.47,10.6 2,9.12 2,7.3 C2,5.48 3.47,4 5.29,4 C6.8,4 8.08,5.02 8.46,6.42 C8.6,6.82 8.68,7.27 8.68,7.79 L8.68,7.79 Z"></path>\n' +
' </svg>'
}

View File

@ -7,33 +7,38 @@ declare var UIkit: any;
selector: 'modal-alert',
template: `
<div #element class="uk-modal" [class.uk-modal-container]="large" [id]="id" uk-modal>
<div class="uk-modal-dialog uk-modal-body uk-animation-fast uk-margin-medium-bottom uk-text-left"
[ngClass]="classBody">
<div [ngClass]="classTitle" class="uk-modal-title" [hidden]=!alertHeader>
<button class="uk-close uk-icon uk-modal-close-default uk-float-right" (click)='cancel()'>
<div class="uk-modal-dialog">
<div class="uk-modal-header uk-flex uk-flex-middle uk-flex-between" [ngClass]="classTitle">
<div class="uk-modal-title" [hidden]=!alertHeader>
<h5 class="uk-margin-remove">{{alertTitle}}</h5>
</div>
<button class="uk-close uk-icon uk-margin-left" (click)='cancel()'>
<icon name="close" ratio="1.5"></icon>
</button>
<h5 class="uk-margin-remove">{{alertTitle}}</h5>
</div>
<div class="uk-margin">
<div class="uk-modal-body uk-animation-fast uk-text-left"
[ngClass]="classBody" [attr.uk-overflow-auto]="overflowBody">
<div *ngIf="message" [hidden]=!alertMessage [innerHTML]="message | safeHtml"></div>
<ng-content></ng-content>
</div>
<div class="uk-grid uk-flex uk-flex-middle">
<label *ngIf="choice" class="uk-width-1-2">
<input type="checkbox" [(ngModel)]="select">
<span class="uk-margin-small-left">Don't show this message again</span>
</label>
<div [ngClass]="(choice)?'uk-width-1-2':'uk-width-1-1'">
<div *ngIf="alertFooter" class="uk-flex-right uk-grid uk-grid-small" uk-grid>
<span *ngIf="okButton" [class.uk-flex-last]="!okButtonLeft">
<button class="uk-button uk-button-primary" [disabled]="okDisabled"
[class.uk-disabled]="okDisabled" (click)="ok()">{{okButtonText}}</button>
</span>
<span *ngIf="cancelButton">
<button class="uk-button uk-button-default uk-margin-small-left"
(click)="cancel()">{{cancelButtonText}}</button>
</span>
<div *ngIf="choice || okButton || cancelButton" class="uk-modal-footer">
<div class="uk-grid uk-flex uk-flex-middle">
<label *ngIf="choice" class="uk-width-1-2">
<input type="checkbox" [(ngModel)]="select">
<span class="uk-margin-small-left">Don't show this message again</span>
</label>
<div [ngClass]="(choice)?'uk-width-1-2':'uk-width-1-1'">
<div *ngIf="alertFooter" class="uk-flex-right uk-grid uk-grid-small" uk-grid>
<span *ngIf="okButton" [class.uk-flex-last]="!okButtonLeft">
<button class="uk-button uk-button-primary uk-box-no-shadow" [disabled]="okDisabled"
[class.uk-disabled]="okDisabled" (click)="ok()">{{okButtonText}}</button>
</span>
<span *ngIf="cancelButton">
<button class="uk-button uk-button-default uk-box-no-shadow uk-margin-small-left"
(click)="cancel()">{{cancelButtonText}}</button>
</span>
</div>
</div>
</div>
</div>
@ -47,9 +52,10 @@ declare var UIkit: any;
*/
export class AlertModal {
@Input() id: string = "modal";
@Input() classTitle: string = "";
@Input() classTitle: string = "uk-background-primary-opacity";
@Input() classBody: string = "";
@Input() large: boolean = false;
@Input() overflowBody: boolean = true;
/**
* Caption for the title.
*/

View File

@ -7,6 +7,7 @@ import {pagingFormatterNoLoad} from './pagingFormatterNoLoad.component';
import {PagingFormatter} from './pagingFormatter.component';
import {IconsModule} from "./icons/icons.module";
import {ResultsAndPagesNumComponent} from "./resultsAndPagesNum.component";
@NgModule({
@ -14,10 +15,12 @@ import {IconsModule} from "./icons/icons.module";
CommonModule, FormsModule, RouterModule, IconsModule
],
declarations: [
ResultsAndPagesNumComponent,
pagingFormatterNoLoad,
PagingFormatter,
],
exports: [
ResultsAndPagesNumComponent,
pagingFormatterNoLoad,
PagingFormatter,
]

View File

@ -8,7 +8,7 @@ import {properties} from "../../../environments/environment";
template: `
<ul *ngIf=" (getTotalPages() > 0 ) && (getTotalPages() > 1) && (currentPage > 0 && currentPage <= getTotalPages()) "
[class.uk-disabled]="isDisabled" class="uk-pagination uk-margin-remove" [ngClass]="'uk-flex-' + position">
<li *ngIf="currentPage > 1">
<li [class.uk-invisible]="currentPage <= 1">
<a [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page', (currentPage - 1))"
[routerLink]=baseUrl aria-label="Previous">
<icon name="chevron_left" [flex]="true" customClass="uk-pagination-previous"></icon>
@ -33,7 +33,7 @@ import {properties} from "../../../environments/environment";
<li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a
[queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage +4))"
[routerLink]=baseUrl>{{(currentPage + 4) | number}}</a></li>
<li *ngIf="getTotalPages() > currentPage">
<li [class.uk-invisible]="getTotalPages() <= currentPage">
<a [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage + 1))"
[routerLink]=baseUrl aria-label="Next">
<icon name="chevron_right" [flex]="true" customClass="uk-pagination-next"></icon>

View File

@ -9,9 +9,9 @@ import {properties} from "../../../environments/environment";
selector: 'paging-no-load',
template: `
<ul disabled *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage && currentPage <= getTotalPages() ) " [ngClass]="customClasses"
class="uk-pagination uk-flex uk-flex-middle uk-flex-right">
class="uk-pagination uk-flex uk-flex-middle ">
<li *ngIf=" currentPage > 1" ><a (click)="onPage((currentPage -1))" aria-label="Previous">
<li [class.uk-invisible]="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>
<li *ngIf=" currentPage -2 > 0"><a (click)="onPage((currentPage -2))">{{(currentPage -2) | number}}</a></li>
<li *ngIf=" currentPage -1 > 0 "><a (click)="onPage((currentPage -1))">{{(currentPage -1) | number}}</a></li>
@ -20,7 +20,7 @@ import {properties} from "../../../environments/environment";
<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">
<li [class.uk-invisible]="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>
@ -36,7 +36,7 @@ import {properties} from "../../../environments/environment";
export class pagingFormatterNoLoad {
@Input() public currentPage: number = 1;
@Input() public customClasses: string = '';
@Input() public customClasses: string = 'uk-flex-center';
// @Input() public navigateTo: string;
@Input() public term: string='';
@Input() public size: number=10;

View File

@ -0,0 +1,33 @@
import {Component, Input} from "@angular/core";
@Component({
selector: 'results-and-pages',
template: `
<h6 *ngIf="type && totalResults" [ngClass]="customClasses">
<span>{{totalResults | number}}</span>
<span class="uk-text-meta uk-text-capitalize"> {{type}}, page </span>
<span>{{page}}</span>
<span class="uk-text-meta"> of </span>
<span>{{getTotalPages() | number}}</span>
</h6>
`
})
export class ResultsAndPagesNumComponent {
@Input() type: string;
@Input() page: number = 1;
@Input() pageSize: number = 10;
@Input() totalResults: number;
@Input() customClasses: string = "";
constructor() {}
getTotalPages(){
let total: number;
let i= this.totalResults/this.pageSize;
let integerI=parseInt(''+i);
total = parseInt(''+((i==integerI)?i:i+1));
return total;
}
}

View File

@ -17,7 +17,7 @@ import {TabComponent} from './tab.component';
selector: 'my-tabs',
template: `
<div id="mytabs" class="uk-grid uk-margin-remove-left">
<div class="uk-margin-medium-right uk-padding-small uk-width-expand uk-padding-remove-bottom" >
<div class="uk-margin-medium-right uk-margin-top uk uk-padding-remove uk-width-expand" >
<div class=" uk-width-1-1" uk-slider="finite: true">
<div class="uk-position-relative " >
<div class="uk-slider-container ">
@ -92,6 +92,7 @@ export class TabsComponent implements AfterContentInit {
public customClass: string;
@ContentChildren(TabComponent) tabs: QueryList<TabComponent>;
@Output() public selectedActiveTab: EventEmitter<any> = new EventEmitter();
@Input() offsetForSticky:number=0;
@Input() isSticky:boolean;
@Output() isStickyChange :EventEmitter<boolean> = new EventEmitter();
public selected: string;
@ -128,10 +129,10 @@ export class TabsComponent implements AfterContentInit {
}
scroll(){
let tabDistanceFromCurrentViewTop = document.getElementById("main-tabs-div") ? document.getElementById("main-tabs-div").getBoundingClientRect().top : null;
if((tabDistanceFromCurrentViewTop <= 0)){
if((tabDistanceFromCurrentViewTop <= this.offsetForSticky)){
this.isStickyChange.emit(true);
this.isSticky =true;
}else if(!(tabDistanceFromCurrentViewTop <= 0)){
}else if(!(tabDistanceFromCurrentViewTop <= this.offsetForSticky)){
this.isStickyChange.emit(false);
this.isSticky =false;
}