MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: MaDgIK:e2f1cc4957901065bfb15dac7e542fdca1d469bb
Branches Tags
MaDgIK:master
MaDgIK:entities-tagging
MaDgIK:develop-16-deposit
MaDgIK:new-search-json
MaDgIK:angular-18
MaDgIK:develop
MaDgIK:recommendations-functionality
MaDgIK:angular-16-pid-resolver
MaDgIK:new-search
MaDgIK:deprecated-angular-upgrade-18
MaDgIK:orcid-openaireId-claim
MaDgIK:develop-hydration
MaDgIK:develop-fos-hierarchical
MaDgIK:develop-filters-redesign
MaDgIK:angular-17
MaDgIK:on-push-strategy
MaDgIK:angular-16-irish-monitor
MaDgIK:grouped-queries
MaDgIK:develop-filters
MaDgIK:deprecated-angular-upgrade
MaDgIK:data-transfer-v2
MaDgIK:deprecated-master
...
compare: MaDgIK:2370c61eb90bce1a47ba620a4ded7de90ebc5952
Branches Tags
MaDgIK:entities-tagging
MaDgIK:develop-16-deposit
MaDgIK:new-search-json
MaDgIK:angular-18
MaDgIK:develop
MaDgIK:recommendations-functionality
MaDgIK:angular-16-pid-resolver
MaDgIK:new-search
MaDgIK:master
MaDgIK:deprecated-angular-upgrade-18
MaDgIK:orcid-openaireId-claim
MaDgIK:develop-hydration
MaDgIK:develop-fos-hierarchical
MaDgIK:develop-filters-redesign
MaDgIK:angular-17
MaDgIK:on-push-strategy
MaDgIK:angular-16-irish-monitor
MaDgIK:grouped-queries
MaDgIK:develop-filters
MaDgIK:deprecated-angular-upgrade
MaDgIK:data-transfer-v2
MaDgIK:deprecated-master

15 Commits
e2f1cc4957 ... 2370c61eb9

Author SHA1 Message Date
argirok 2370c61eb9 Merge remote-tracking branch 'origin/new-theme' into new-theme-linking 2022-04-06 13:20:13 +03:00
argirok b20fcfa219 more layout changes for the linking (eg filters, icons, etc) 2022-04-05 18:36:08 +03:00
argirok 6d7b1976a9 Merge branch 'new-theme' into new-theme-linking 2022-03-16 19:18:26 +02:00
argirok b7cc2c0147 Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme 2022-03-16 19:14:48 +02:00
argirok b027575fc0 claims updates 2022-03-16 18:54:22 +02:00
argirok 7a8358bb47 stepper component v2 2022-03-16 18:53:19 +02:00
argirok f2217a4a38 initial commit of stepper component 2022-03-16 17:24:48 +02:00
Konstantinos Triantafyllou 854814d2ac Merge branch 'new-theme' into new-theme-linking 2022-03-09 23:38:48 +02:00
argirok 9c349ede97 Merge branch 'new-theme' into new-theme-linking 2022-03-09 11:07:19 +02:00
argirok 2542d452be Merge remote-tracking branch 'origin/new-theme' into new-theme-linking 2022-03-09 10:52:52 +02:00
argirok 7d5ac5eaf9 Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme 2022-03-09 10:52:29 +02:00
argirok c9ed6a255b linking updates 2022-03-02 18:08:37 +02:00
argirok dcffb611a2 v2 2022-03-02 12:18:24 +02:00
argirok 9e961d46c1 Merge branch 'new-theme' into new-theme-linking 2022-02-25 16:52:30 +02:00
argirok 9222deed7b initial linking changes 2022-02-25 14:52:36 +02:00
32 changed files with 858 additions and 918 deletions
Show Stats Expand all files Collapse all files

43
claims/claim-utils/claimContextSearchForm.component.html
View File

@ -4,32 +4,27 @@
<div class="uk-width-expand"> <div class="uk-width-expand">
<div class="uk-grid uk-flex uk-flex-middle"> <div class="uk-grid uk-flex uk-flex-middle">
<div class="uk-width-1-2"> <div class="uk-margin">
Select communities to link to <div class="uk-inline">
</div> <claim-enities-selection *ngIf="showOptions && showOptions.linkToEntities.length > 0"
<div class="uk-width-1-2"> [showOptions]="showOptions"></claim-enities-selection>
<div class="uk-margin"> <span class="uk-form-icon uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20"
<div class="uk-inline"> xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg></span>
<span class="uk-form-icon uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" <input class=" uk-input uk-width-medium" [(ngModel)]="keyword" name="keyword"
xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg></span> placeholder="Search communities..."/>
<input class=" uk-input uk-width-medium" [(ngModel)]="keyword" name="keyword" <span *ngIf="keyword.length > 0" class="uk-margin-small-right uk-icon" style="cursor: pointer;"
placeholder="Search communities..."/> (click)="keyword='';">
<span *ngIf="keyword.length > 0" class="uk-margin-small-right uk-icon" style="cursor: pointer;" <svg width="20" height="20" viewBox="0 0 20 20"
(click)="keyword='';"> xmlns="http://www.w3.org/2000/svg" data-svg="close"><path fill="none" stroke="#000"
<svg width="20" height="20" viewBox="0 0 20 20" stroke-width="1.06"
xmlns="http://www.w3.org/2000/svg" data-svg="close"><path fill="none" stroke="#000" d="M16,16 L4,4"></path><path
stroke-width="1.06" fill="none"
d="M16,16 L4,4"></path><path stroke="#000"
fill="none" stroke-width="1.06"
stroke="#000" d="M16,4 L4,16"></path></svg>
stroke-width="1.06" </span>
d="M16,4 L4,16"></path></svg>
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-margin-right uk-padding"> <div class="uk-margin-right uk-padding">
<span *ngFor="let community of communities" [title]="(this.results.length>=basketLimit)?'Basket reached the size limit':''"> <span *ngFor="let community of communities" [title]="(this.results.length>=basketLimit)?'Basket reached the size limit':''">

1
claims/claim-utils/claimContextSearchForm.component.ts
View File

@ -21,6 +21,7 @@ export class ClaimContextSearchFormComponent {
@Input() communityId: string = null; @Input() communityId: string = null;
@Input() public inlineClaim: boolean = false; @Input() public inlineClaim: boolean = false;
@Input() basketLimit; @Input() basketLimit;
@Input() showOptions;
public selectedCommunityId: string = "0"; public selectedCommunityId: string = "0";
public selectedCategoryId: string = "0"; public selectedCategoryId: string = "0";

5
claims/claim-utils/claimContextSearchForm.module.ts
View File

@ -5,12 +5,13 @@ import { ClaimContextSearchFormComponent } from './claimContextSearchForm.compon
import {StaticAutocompleteModule} from '../../utils/staticAutoComplete/staticAutoComplete.module'; import {StaticAutocompleteModule} from '../../utils/staticAutoComplete/staticAutoComplete.module';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import {HelperModule} from '../../utils/helper/helper.module'; import {HelperModule} from '../../utils/helper/helper.module';
import {ClaimProjectsSearchFormModule} from "./claimProjectSearchForm.module";
@NgModule({ @NgModule({
imports: [ imports: [
SharedModule,RouterModule, SharedModule, RouterModule,
StaticAutocompleteModule, StaticAutocompleteModule,
HelperModule HelperModule, ClaimProjectsSearchFormModule
], ],
declarations: [ declarations: [

37
claims/claim-utils/claimEntitiesSelection.component.ts Normal file
View File

@ -0,0 +1,37 @@
import {Component, Input, ViewChild} from '@angular/core';
import {ShowOptions} from './claimHelper.class';
import {MatSelect} from "@angular/material/select";
@Component({
selector: 'claim-enities-selection',
template:`
<span *ngIf="showOptions && showOptions.linkToEntities && showOptions.linkToEntities.length > 0"
class=" entitiesSelection portal-box uk-text-small clickable" style=""
(click)="open()">
<mat-select [(value)]="showOptions.show"
[disableOptionCentering]="true" >
<mat-option *ngIf="showOptions.linkToEntities.indexOf('result')!=-1" value="result">Research outcomes</mat-option>
<mat-option *ngIf="showOptions.linkToEntities.indexOf('project')!=-1" value="project">Projects</mat-option>
<mat-option *ngIf="showOptions.linkToEntities.indexOf('context')!=-1" value="context">Research communities</mat-option>
</mat-select>
</span>
`,
})
export class ClaimEntitiesSelectionComponent{
@ViewChild(MatSelect) matSelect: MatSelect;
@Input() showOptions:ShowOptions = new ShowOptions();
open() {
if (this.matSelect && !this.matSelect.focused) {
this.matSelect.open();
}
}
}

31
claims/claim-utils/claimHelper.class.ts
View File

@ -142,9 +142,9 @@ export class ShowOptions {
show: string; //show values: source, result, project, context, claim show: string; //show values: source, result, project, context, claim
linkTo: string; // linkTo /values: result, project, context linkTo: string; // linkTo /values: result, project, context
linkToEntities: string[]; // show linkToEntities /values: result, project, context linkToEntities: string[]; // show linkToEntities /values: result, project, context
basketShowSources: boolean; basketShowSources: boolean = true;
basketShowLinksTo: boolean; basketShowLinksTo: boolean = false;
constructor() { constructor() {
this.show = "source"; this.show = "source";
this.linkTo = "project"; this.linkTo = "project";
@ -155,23 +155,24 @@ export class ShowOptions {
showSource() { showSource() {
this.show = "source"; this.show = "source";
this.basketswitchToSources();
HelperFunctions.scroll();
}
basketswitchToSources() {
this.basketShowLinksTo = false; this.basketShowLinksTo = false;
this.basketShowSources = true; this.basketShowSources = true;
HelperFunctions.scroll();
} }
basketswitchToLinkTo() {
showLinkTo() {
this.show = this.linkTo;
this.basketShowLinksTo = true; this.basketShowLinksTo = true;
this.basketShowSources = false; this.basketShowSources = false;
}
showLinkTo() {
console.log(this.linkTo, "showLinkTo")
this.show = this.linkTo;
this.basketswitchToLinkTo();
HelperFunctions.scroll(); HelperFunctions.scroll();
} }
showBasketSources() {
if (this.show != 'source') {
this.basketShowSources = !this.basketShowSources;
this.basketShowLinksTo = !this.basketShowSources;
}
}
} }

135
claims/claim-utils/claimProjectSearchForm.component.html
View File

@ -1,10 +1,8 @@
<form class=" uk-margin-top uk-animation "> <form class=" uk-margin-top uk-animation ">
<div class="uk-margin-small-bottom">Start searching for projects and add them to the basket to link them to your sources
<!-- <helper div="link-project-form" tooltip=true></helper> -->
</div>
<!-- <input class=" uk-input uk-width-large" [(ngModel)]="keyword" name="keyword" placeholder="Search for projects..."/>--> <div class="uk-inline">
<div class="uk-inline"> <claim-enities-selection *ngIf="showOptions && showOptions.linkToEntities.length > 0" [showOptions]="showOptions"></claim-enities-selection>
<a *ngIf="keyword.length > 0" class="uk-form-icon uk-form-icon-flip" <a *ngIf="keyword.length > 0" class="uk-form-icon uk-form-icon-flip"
(click)="keyword = ''" (click)="keyword = ''"
uk-icon="icon: close"></a> uk-icon="icon: close"></a>
@ -34,40 +32,9 @@
</div> </div>
<div class="uk-grid"> <div class="uk-grid">
<div class="search-filters uk-width-medium"> <div class="search-filters uk-width-1-1">
<!-- <div class="uk-width-1-1 uk-margin-small-bottom ">
<!--<div *ngIf="countFilters()>0 && openaireResultsNum > 0" class="uk-grid uk-flex uk-flex-bottom">
<div *ngIf="countFilters()>0" class="uk-margin-small-bottom">
<span *ngIf = "searchUtils.keyword.length > 0"><span class="uk-text-bold">Keywords:</span>
<a (click) = "clearKeywords() " title="Remove keywords" [class]="((disableForms)?' uk-disabled':' ')+' portal-color '"><span class=" clickable " aria-hidden="true"><span class="uk-icon ">
<svg width="16" height="16" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="0.8"><path fill="none" stroke="#000" stroke-width="1.6" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.6" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span [innerHtml]="searchUtils.keyword"></span>
</span>
<div *ngFor="let filter of filters " >
<span *ngIf = "filter.countSelectedValues > 0"> <span class="uk-text-bold">{{filter.title}}:</span>
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " >
<a [title]="'Remove '+value.name"(click) = "removeFilter(value, filter) " [class]="((disableForms)?' uk-disabled':' ')+' portal-color '"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
<svg width="16" height="16" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="0.8"><path fill="none" stroke="#000" stroke-width="1.6" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.6" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span [innerHtml]="(value.name.length > 25)?value.name.substring(0,25)+'...':value.name" [title]="value.name"></span><span *ngIf="!end" class=" ">, </span>
</span>
</span>
</div>
</div>
<div class="uk-margin-small-bottom uk-margin-small-top uk-grid">
<a *ngIf="countFilters()>1" (click)="clearFilters()" [class]="((disableForms)?'uk-disabled uk-link-muted':'')+' portal-link ' + 'uk-width-1-2'">
Clear All
</a>
</div>
</div> -->
<div *ngIf="countFilters()>0" class="uk-grid uk-flex uk-flex-bottom">
<div class="uk-grid"> <div class="uk-grid">
<h6 class="uk-text-bold">Filters</h6> <h6 class="uk-text-bold">Filters</h6>
<a *ngIf="countFilters()>1" (click)="clearFilters()" <a *ngIf="countFilters()>1" (click)="clearFilters()"
@ -99,7 +66,7 @@
<ng-container *ngIf = "filter.countSelectedValues > 0"> <ng-container *ngIf = "filter.countSelectedValues > 0">
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " <span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; "
[title]="'Remove '+value.name" (click) = "removeFilter(value, filter) " > [title]="'Remove '+value.name" (click) = "removeFilter(value, filter) " >
<!-- if no grid on the div above, remove it and move class 'selectedFilterLabel' on top span --> &lt;!&ndash; if no grid on the div above, remove it and move class 'selectedFilterLabel' on top span &ndash;&gt;
<span class="selectedFilterLabel "> <span class="selectedFilterLabel ">
<a [class]="((openaireResultsStatus == <a [class]="((openaireResultsStatus ==
errorCodes.LOADING)?' uk-disabled':' ')+' uk-link-text '"> errorCodes.LOADING)?' uk-disabled':' ')+' uk-link-text '">
@ -115,59 +82,49 @@
</ng-container> </ng-container>
</ng-container> </ng-container>
</div> </div>
</div> </div>-->
<!--<ul class="uk-list"> <ng-container *ngIf="openaireResultsNum > 0">
<li class="uk-open"> <ng-container *ngFor="let filter of rangeFilters">
<h6 class="uk-margin-bottom-remove ">Active between
</h6> <div class="uk-inline">
<div aria-expanded="false"> <button class="uk-button uk-button-default uk-button-small uk-margin-small-right uk-margin-small-bottom "
<div class="searchFilterBoxValues "> type="button"><span *ngIf="!filter.selectedFromAndToValues">{{filter.title}}</span><span *ngIf="filter.selectedFromAndToValues">{{filter.selectedFromAndToValues}}</span><span uk-icon="chevron-down"></span></button>
<form class="uk-inline"> <div uk-dropdown="mode: click" class="uk-width-large" style="max-width:460px !important;">
<div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<input class=" uk-input uk-width-2-5" [(ngModel)]="startYear" name="keyword" <range-filter [isDisabled]="openaireResultsStatus ==
placeholder="Year (e.g 1990)"/> errorCodes.LOADING" [filter]="filter" (onFilterChange)="dateFilterChanged(filter)"
<input class=" uk-input uk-width-2-5" [(ngModel)]="endYear" name="keyword" [showQuickButtons]="false"
placeholder="Year (e.g 1990)"/> ></range-filter>
<button type="submit" (click)="yearChanged()" style="cursor: pointer;" class="uk-icon"><svg width="20" </div>
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></button>
</form>
</div> </div>
</div> </div>
</li>
</ul>-->
<ng-container *ngFor="let filter of rangeFilters"> </ng-container>
<li>
<range-filter [isDisabled]="openaireResultsStatus == <ng-container *ngFor="let filter of filters ">
errorCodes.LOADING" [filter]="filter" (onFilterChange)="dateFilterChanged(filter)" <div class="uk-inline">
[showQuickButtons]="false" <button class="uk-button uk-button-default uk-button-small uk-margin-small-right uk-margin-small-bottom "
></range-filter> type="button">{{filter.title}}<span *ngIf="filter.countSelectedValues>0"> ({{filter.countSelectedValues}})</span><span uk-icon="chevron-down"></span></button>
</li> <div uk-dropdown="mode: click" class="uk-width-large uk-overflow-auto" style="max-width:460px !important; ">
<div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<search-filter [isDisabled]="openaireResultsStatus ==
errorCodes.LOADING" [filter]="filter"
[showResultCount]=true filterValuesNum="0"
(onFilterChange)="filterChanged($event)" [actionRoute]="false"></search-filter>
</div>
</div>
</div>
</ng-container>
</ng-container> </ng-container>
<search-filter *ngFor="let filter of filters " [isDisabled]="false" [filter]="filter" [showResultCount]=true
(onFilterChange)="filterChanged($event)" [actionRoute]="false"></search-filter>
</div> </div>
<div class="uk-width-expand@m uk-width-1-1@s uk-first-column"> <div class="uk-width-expand@m uk-width-1-1@s uk-first-column">
<!-- <div *ngIf="openaireResultsNum != null && openaireResultsNum > 0" class="uk-clearfix portal-hr ">
<div class="uk-grid"> <div *ngIf="openaireResultsStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1"
<div *ngIf="openaireResultsNum>0" class="uk-width-1-2"> role="alert"><span class="loading-gif uk-align-center"></span></div>
<span class="portal-color">{{openaireResultsNum|number}}</span> projects, page <span <claim-results [localStoragePrefix]="localStoragePrefix" [results]=openaireResults
class="portal-color">{{openaireResultsPage | number}}</span> of <span [selectedResults]=selectedProjects [basketLimit]="basketLimit"></claim-results>
class="portal-color">{{totalPages(openaireResultsNum)|number}}</span>
</div>
<div class="uk-width-1-2 uk-padding-remove">
<paging-no-load class="uk-float-right" [currentPage]="openaireResultsPage"
[totalResults]="openaireResultsNum" [term]="keyword" [size]="size"
(pageChange)="openaireResultsPageChange($event)"></paging-no-load>
</div>
</div>
</div>-->
<div *ngIf="openaireResultsNum != null && openaireResultsNum > 0" class="uk-clearfix "> <div *ngIf="openaireResultsNum != null && openaireResultsNum > 0" class="uk-clearfix ">
<div class= "paging-hr searchPaging uk-margin-small-bottom" <div class= "paging-hr searchPaging uk-margin-small-bottom"
*ngIf="(openaireResultsNum > 0) || (openaireResultsStatus == errorCodes.LOADING)"> *ngIf="(openaireResultsNum > 0) || (openaireResultsStatus == errorCodes.LOADING)">
@ -188,10 +145,6 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="openaireResultsStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1"
role="alert"><span class="loading-gif uk-align-center"></span></div>
<claim-results [localStoragePrefix]="localStoragePrefix" [results]=openaireResults
[selectedResults]=selectedProjects [basketLimit]="basketLimit"></claim-results>
</div> </div>
</div> </div>
</div> </div>

1
claims/claim-utils/claimProjectSearchForm.component.ts
View File

@ -39,6 +39,7 @@ export class ClaimProjectsSearchFormComponent {
@Input() public inlineClaim:boolean=false; @Input() public inlineClaim:boolean=false;
@Input() localStoragePrefix:string = ""; @Input() localStoragePrefix:string = "";
@Input() basketLimit; @Input() basketLimit;
@Input() showOptions;
public errorCodes:ErrorCodes = new ErrorCodes(); public errorCodes:ErrorCodes = new ErrorCodes();
public projects:string[]; public projects:string[];

15
claims/claim-utils/claimProjectSearchForm.module.ts
View File

@ -16,20 +16,23 @@ import {ClaimResultsModule} from './claimResults.module';
import {PagingModule } from '../../utils/paging.module'; import {PagingModule } from '../../utils/paging.module';
import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module'; import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module';
import {RangeFilterModule} from "../../utils/rangeFilter/rangeFilter.module"; import {RangeFilterModule} from "../../utils/rangeFilter/rangeFilter.module";
import {ClaimEntitiesSelectionComponent} from "./claimEntitiesSelection.component";
import {MatSelectModule} from "@angular/material/select";
@NgModule({ @NgModule({
imports: [ imports: [
SharedModule, CommonModule, SharedModule, CommonModule,
// LoadingModalModule, // LoadingModalModule,
ProjectServiceModule, ProjectsServiceModule, EntitiesAutocompleteModule, HelperModule, ProjectServiceModule, ProjectsServiceModule, EntitiesAutocompleteModule, HelperModule,
PagingModule, SearchFilterModule, ClaimResultsModule, RangeFilterModule PagingModule, SearchFilterModule, ClaimResultsModule, RangeFilterModule, MatSelectModule
], ],
providers:[ providers:[
], ],
declarations: [ declarations: [
ClaimProjectsSearchFormComponent ClaimProjectsSearchFormComponent,
ClaimEntitiesSelectionComponent
], ],
exports: [ClaimProjectsSearchFormComponent ] exports: [ClaimProjectsSearchFormComponent, ClaimEntitiesSelectionComponent]
}) })
export class ClaimProjectsSearchFormModule { } export class ClaimProjectsSearchFormModule { }

194
claims/claim-utils/claimResultSearchForm.component.html
View File

@ -1,11 +1,12 @@
<form class=" uk-margin-top"> <form class=" uk-margin-top">
<div class="uk-margin-small-bottom">Start searching Research Outcomes and add them to the Basket to Link <!-- <div class="uk-margin-small-bottom">Start searching Research Outcomes and add them to the Basket to Link
<!-- <helper div="link-entity-form" styleName="" tooltip=true></helper> --> &lt;!&ndash; <helper div="link-entity-form" styleName="" tooltip=true></helper> &ndash;&gt;
</div> </div>-->
<!-- <input class=" uk-input uk-width-large form-control" [(ngModel)]="keyword" name="keyword"-->
<!-- placeholder="Search for research outcomes..."/>-->
<div class="uk-inline"> <div class="uk-inline">
<claim-enities-selection *ngIf="showOptions && showOptions.linkToEntities.length > 0"
[showOptions]="showOptions"></claim-enities-selection>
<a *ngIf="keyword.length > 0" class="uk-form-icon uk-form-icon-flip" <a *ngIf="keyword.length > 0" class="uk-form-icon uk-form-icon-flip"
(click)="keyword = ''" (click)="keyword = ''"
uk-icon="icon: close"></a> uk-icon="icon: close"></a>
@ -14,7 +15,7 @@
[(ngModel)]="keyword" name="keyword"> [(ngModel)]="keyword" name="keyword">
</div> </div>
<span class="input-group-btn space"> <span class="input-group-btn space">
<button (click)="search(true)" type="submit" class=" uk-button portal-button">Search</button> <button (click)="search(true)" type="submit" class=" uk-button uk-button-primary">Search</button>
</span> </span>
<!--helper div="link-entity-form" styleName="uk-width-medium"></helper--> <!--helper div="link-entity-form" styleName="uk-width-medium"></helper-->
@ -22,7 +23,7 @@
</form> </form>
<div *ngIf="!showSearchResults"> <div *ngIf="!showSearchResults">
<div class="uk-text-center uk-text-large uk-text-muted uk-margin-large-top"> <div class="uk-text-center uk-text-large uk-text-muted uk-margin-large-top">
No research outcomes yet...<br>Start searching for research outcomes to add them in the Basket No sources yet...<br>Use the searchbar and find linking sources.
</div> </div>
</div> </div>
<div *ngIf="showSearchResults" class="uk-margin-top uk-animation"> <div *ngIf="showSearchResults" class="uk-margin-top uk-animation">
@ -60,7 +61,7 @@
class="portal-color">{{countTotalPages(crossrefResultsNum)|number}}</span> class="portal-color">{{countTotalPages(crossrefResultsNum)|number}}</span>
</div>--> </div>-->
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase" <!-- <div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase"
*ngIf="crossrefResultsNum > 0"> *ngIf="crossrefResultsNum > 0">
{{crossrefResultsNum|number}} {{crossrefResultsNum|number}}
<span class="uk-text-muted uk-text-uppercase"> research outcomes, page </span> <span class="uk-text-muted uk-text-uppercase"> research outcomes, page </span>
@ -72,7 +73,7 @@
<paging-no-load class="uk-float-right" [currentPage]="crossrefPage" [totalResults]="crossrefResultsNum" <paging-no-load class="uk-float-right" [currentPage]="crossrefPage" [totalResults]="crossrefResultsNum"
[term]="keyword" [term]="keyword"
[size]="size" (pageChange)="crossrefPageChange($event)"></paging-no-load> [size]="size" (pageChange)="crossrefPageChange($event)"></paging-no-load>
</div> </div>-->
</div> </div>
</div> </div>
<div *ngIf="crossrefStatus === errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" <div *ngIf="crossrefStatus === errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1"
@ -82,14 +83,18 @@
<claim-results [localStoragePrefix]=localStoragePrefix [results]=crossrefResults <claim-results [localStoragePrefix]=localStoragePrefix [results]=crossrefResults
[selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results> [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results>
</div> </div>
<paging-no-load *ngIf="crossrefStatus != errorCodes.LOADING && crossrefResultsNum>0 " class="uk-float-right"
[currentPage]="crossrefPage" [totalResults]="crossrefResultsNum"
[term]="keyword"
[size]="size" (pageChange)="crossrefPageChange($event)"></paging-no-load>
</div> </div>
</div> </div>
<div *ngIf="activeTab == 'openaire'" id="openaire" class="uk-animation-fade"> <div *ngIf="activeTab == 'openaire'" id="openaire" class="uk-animation-fade">
<div class="uk-grid"> <div class="uk-grid">
<div class="search-filters uk-width-medium"> <div class="search-filters uk-width-1-1">
<div *ngIf="countFilters()>0" class="uk-grid uk-flex uk-flex-bottom"> <!--<div *ngIf="countFilters()>0" class="uk-grid uk-flex uk-flex-bottom">
<div class="uk-grid"> <div class="uk-grid">
<h6 class="uk-text-bold">Filters</h6> <h6 class="uk-text-bold">Filters</h6>
<a *ngIf="countFilters()>1" (click)="clearFilters()" <a *ngIf="countFilters()>1" (click)="clearFilters()"
@ -121,7 +126,7 @@
<ng-container *ngIf = "filter.countSelectedValues > 0"> <ng-container *ngIf = "filter.countSelectedValues > 0">
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " <span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; "
[title]="'Remove '+value.name" (click) = "removeFilter(value, filter) " > [title]="'Remove '+value.name" (click) = "removeFilter(value, filter) " >
<!-- if no grid on the div above, remove it and move class 'selectedFilterLabel' on top span --> &lt;!&ndash; if no grid on the div above, remove it and move class 'selectedFilterLabel' on top span &ndash;&gt;
<span class="selectedFilterLabel "> <span class="selectedFilterLabel ">
<a [class]="((openaireResultsStatus == <a [class]="((openaireResultsStatus ==
errorCodes.LOADING)?' uk-disabled':' ')+' uk-link-text '"> errorCodes.LOADING)?' uk-disabled':' ')+' uk-link-text '">
@ -137,52 +142,44 @@
</ng-container> </ng-container>
</ng-container> </ng-container>
</div> </div>
</div> </div>-->
<!-- Type filter--> <ng-container *ngIf="openaireResultsNum > 0">
<ul class="uk-list" > <ng-container *ngFor="let filter of rangeFilters">
<!--<li class="uk-open uk-margin-small-bottom">
<h6 class="uk-margin-bottom-remove ">Result Type (4) <div class="uk-inline">
</h6> <button class="uk-button uk-button-default uk-button-small uk-margin-small-right uk-margin-small-bottom "
<div aria-expanded="false"> type="button">{{filter.title}}<span uk-icon="chevron-down"></span></button>
<div class="searchFilterBoxValues "> <div uk-dropdown="mode: click" class="uk-width-large" style="max-width:460px !important;" >
<div *ngFor="let type of openaireTypeValues" class="uk-animation-fade filterItem"> <div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<range-filter [isDisabled]="openaireResultsStatus ==
<div title="{{type.title}}"> errorCodes.LOADING" [filter]="filter" (onFilterChange)="dateFilterChanged(filter)"
<input [value]="type.value" [(ngModel)]="openaireResultsType" [name]=type.value [showQuickButtons]="false"
type="radio" (ngModelChange)="openaireTypeChanged(type.value)"/> ></range-filter>
{{_formatName(type.title,type.count)}}
<span *ngIf="type.count!=null">{{' (' + (type.count|number) + ')'}}</span>
</div>
</div> </div>
</div> </div>
</div> </div>
</li>-->
<ng-container *ngFor="let filter of rangeFilters"> </ng-container>
<li>
<range-filter [isDisabled]="openaireResultsStatus == <ng-container *ngFor="let filter of openaireResultsfilters ">
errorCodes.LOADING" [filter]="filter" (onFilterChange)="dateFilterChanged(filter)" <div class="uk-inline">
[showQuickButtons]="false" <button class="uk-button uk-button-default uk-button-small uk-margin-small-right uk-margin-small-bottom "
></range-filter> type="button">{{filter.title}}<span *ngIf="filter.countSelectedValues>0"> ({{filter.countSelectedValues}})</span><span uk-icon="chevron-down"></span></button>
</li> <div uk-dropdown="mode: click" class=" uk-width-large uk-height-max-large " style="max-width:460px !important;">
</ng-container> <div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<search-filter [isDisabled]="openaireResultsStatus ==
</ul> errorCodes.LOADING" [filter]="filter" [filterValuesNum]="0"
[showResultCount]=true
<search-filter *ngFor="let filter of openaireResultsfilters " [isDisabled]="openaireResultsStatus == (onFilterChange)="filterChanged($event)" [actionRoute]="false"></search-filter>
errorCodes.LOADING" [filter]="filter" </div>
[showResultCount]=true </div>
(onFilterChange)="filterChanged($event)" [actionRoute]="false"></search-filter> </div>
</ng-container>
</ng-container>
</div> </div>
<div class="uk-width-expand@m uk-width-1-1@s uk-first-column"> <div class="uk-width-expand@m uk-width-1-1@s uk-first-column">
<div class="uk-margin-top"> <div class="">
<!-- <quick-selections [resultTypes]="resultTypes"
(typeChange)="openaireTypeChanged()" [isDisabled]="openaireResultsStatus ==
errorCodes.LOADING"
[quickFilter]="quickFilter" [QFselected]="(quickFilter)?quickFilter.selected:null"
[properties]="properties">
</quick-selections>-->
<div *ngIf="openaireResultsStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" <div *ngIf="openaireResultsStatus == errorCodes.NONE" class="uk-alert uk-alert-primary"
role="alert">No Results found role="alert">No Results found
</div> </div>
@ -192,31 +189,17 @@
<div *ngIf="openaireResultsStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" <div *ngIf="openaireResultsStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger"
role="alert">Service not available role="alert">Service not available
</div> </div>
<div *ngIf="openaireResultsNum != null && openaireResultsNum > 0" class="uk-clearfix ">
<div class= "paging-hr searchPaging uk-margin-small-bottom"
*ngIf="(openaireResultsNum > 0) || (openaireResultsStatus == errorCodes.LOADING)">
<div class="uk-panel uk-margin-small-top uk-grid uk-flex uk-flex-middle">
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase"
*ngIf="openaireResultsNum > 0">
<span class="uk-text-bold">{{openaireResultsNum|number}}</span>
<span class="uk-text-muted uk-text-uppercase"> research outcomes, page </span>
<span class="uk-text-bold">{{openaireResultsPage | number}}</span>
<span class="uk-text-muted uk-text-uppercase"> of </span>
<span class="uk-text-bold">{{(countTotalPages(openaireResultsNum)|number)}}</span>
</div>
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand uk-padding-remove-left" *ngIf=" openaireResultsStatus != errorCodes.LOADING">
<paging-no-load class="uk-float-right" [currentPage]="openaireResultsPage"
[totalResults]="openaireResultsNum" [term]="keyword"
[size]="size" (pageChange)="openaireResultsPageChange($event)"></paging-no-load>
</div>
</div>
</div>
</div>
<div *ngIf="openaireResultsStatus === errorCodes.LOADING" <div *ngIf="openaireResultsStatus === errorCodes.LOADING"
class="uk-animation-fade uk-margin-top uk-width-1-1" class="uk-animation-fade uk-margin-top uk-width-1-1"
role="alert"><span class="loading-gif uk-align-center"></span></div> role="alert"><span class="loading-gif uk-align-center">Loading...</span></div>
<claim-results [localStoragePrefix]=localStoragePrefix <claim-results [localStoragePrefix]=localStoragePrefix
[results]=openaireResults [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results> [results]=openaireResults [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results>
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand uk-padding-remove-left" *ngIf=" openaireResultsStatus != errorCodes.LOADING && openaireResultsNum != null && openaireResultsNum > 0" >
<paging-no-load class="uk-float-right" [currentPage]="openaireResultsPage"
[totalResults]="openaireResultsNum" [term]="keyword"
[size]="size" (pageChange)="openaireResultsPageChange($event)"></paging-no-load>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -231,30 +214,7 @@
<div *ngIf="orcidStatus == errorCodes.NONE && orcidResultsNum == -1" <div *ngIf="orcidStatus == errorCodes.NONE && orcidResultsNum == -1"
class="uk-alert uk-alert-primary "> No results found class="uk-alert uk-alert-primary "> No results found
</div> </div>
<div *ngIf=" ((orcidResultsNum >0) && (totalPages > 1) && ( 0 < page && page <= totalPages )) "
class="uk-clearfix">
<div class="uk-grid">
<!--<div *ngIf="orcidResultsNum>0" class="uk-width-1-2">
<span class="portal-color">{{orcidResultsNum|number}}</span> research outcomes, page <span
class="portal-color">{{orcidPage | number}}</span> of <span
class="portal-color">{{countTotalPages(orcidResultsNum)|number}}</span>
</div>-->
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase"
*ngIf="orcidResultsNum > 0">
{{orcidResultsNum|number}}
<span class="uk-text-muted uk-text-uppercase"> research outcomes, page </span>
{{orcidPage | number}}
<span class="uk-text-muted uk-text-uppercase"> of </span>
{{(countTotalPages(orcidResultsNum)|number)}}
</div>
<div class="uk-width-1-2 uk-padding-remove-left">
<paging-no-load class="uk-float-right" [currentPage]="orcidPage" [totalResults]="orcidResultsNum"
[term]="keyword" [size]="size"
(pageChange)="orcidPageChange($event)"></paging-no-load>
</div>
</div>
</div>
<div *ngIf="orcidResultsNum >= 0" class="panel-body"> <div *ngIf="orcidResultsNum >= 0" class="panel-body">
<span><span class="uk-text-bold">Showing results for</span> <span><span class="uk-text-bold">Showing results for</span>
<a target="_blank" href="http://orcid.org/{{authorId}}"> <span <a target="_blank" href="http://orcid.org/{{authorId}}"> <span
@ -284,6 +244,15 @@
[selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results> [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results>
<div *ngIf="orcidResultsNum == 0" class="uk-alert uk-alert-primary uk-margin-top"> No results found</div> <div *ngIf="orcidResultsNum == 0" class="uk-alert uk-alert-primary uk-margin-top"> No results found</div>
</div> </div>
<div *ngIf=" ((orcidResultsNum >0) && (totalPages > 1) && ( 0 < page && page <= totalPages )) "
class="uk-clearfix">
<paging-no-load class="uk-float-right" [currentPage]="orcidPage" [totalResults]="orcidResultsNum"
[term]="keyword" [size]="size"
(pageChange)="orcidPageChange($event)"></paging-no-load>
</div>
</div> </div>
<div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert"> <div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert">
<span class="loading-gif uk-align-center"></span></div> <span class="loading-gif uk-align-center"></span></div>
@ -297,35 +266,18 @@
role="alert">Service not available role="alert">Service not available
</div> </div>
<div class="uk-margin-top"> <div class="uk-margin-top">
<div *ngIf="dataciteResultsNum != null && dataciteResultsNum > 0" class="uk-clearfix ">
<div class="uk-grid">
<!-- <div *ngIf="dataciteResultsNum>0" class="uk-width-1-2">
<span class="portal-color">{{dataciteResultsNum|number}}</span> research outcomes, page <span
class="portal-color">{{datacitePage | number}}</span> of <span
class="portal-color">{{countTotalPages(dataciteResultsNum)|number}}</span>
</div>-->
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase"
*ngIf="dataciteResultsNum > 0">
{{dataciteResultsNum|number}}
<span class="uk-text-muted uk-text-uppercase"> research outcomes, page </span>
{{datacitePage | number}}
<span class="uk-text-muted uk-text-uppercase"> of </span>
{{(countTotalPages(dataciteResultsNum)|number)}}
</div>
<div class="uk-width-1-2 uk-padding-remove-left">
<paging-no-load class="uk-float-right" [currentPage]="datacitePage" [totalResults]="dataciteResultsNum"
[term]="keyword"
[size]="size" (pageChange)="datacitePageChange($event)"></paging-no-load>
</div>
</div>
</div>
<div *ngIf="dataciteStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" <div *ngIf="dataciteStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1"
role="alert"><span class="loading-gif uk-align-center"></span></div> role="alert"><span class="loading-gif uk-align-center"></span></div>
<div> <div>
<claim-results [localStoragePrefix]=localStoragePrefix *ngIf="dataciteResults.length > 0 " <claim-results [localStoragePrefix]=localStoragePrefix *ngIf="dataciteResults.length > 0 "
[results]=dataciteResults [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results> [results]=dataciteResults [selectedResults]=selectedResults [basketLimit]="basketLimit"></claim-results>
</div> </div>
<div *ngIf="dataciteResultsNum != null && dataciteResultsNum > 0" class="uk-clearfix ">
<paging-no-load class="uk-float-right" [currentPage]="datacitePage" [totalResults]="dataciteResultsNum"
[term]="keyword"
[size]="size" (pageChange)="datacitePageChange($event)"></paging-no-load>
</div>
</div> </div>
</div> </div>

1
claims/claim-utils/claimResultSearchForm.component.ts
View File

@ -29,6 +29,7 @@ export class ClaimResultSearchFormComponent {
@Input() public properties: EnvProperties; @Input() public properties: EnvProperties;
@Input() localStoragePrefix: string = ""; @Input() localStoragePrefix: string = "";
@Input() basketLimit; @Input() basketLimit;
@Input() showOptions;
public errorCodes: ErrorCodes = new ErrorCodes(); public errorCodes: ErrorCodes = new ErrorCodes();

3
claims/claim-utils/claimResultSearchForm.module.ts
View File

@ -17,10 +17,11 @@ import {HelperModule} from '../../utils/helper/helper.module';
import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module'; import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module';
import {QuickSelectionsModule} from "../../searchPages/searchUtils/quick-selections.module"; import {QuickSelectionsModule} from "../../searchPages/searchUtils/quick-selections.module";
import {RangeFilterModule} from "../../utils/rangeFilter/rangeFilter.module"; import {RangeFilterModule} from "../../utils/rangeFilter/rangeFilter.module";
import {ClaimProjectsSearchFormModule} from "./claimProjectSearchForm.module";
@NgModule({ @NgModule({
imports: [SharedModule, CommonModule, SearchResearchResultsServiceModule, PagingModule, SearchCrossrefServiceModule, imports: [SharedModule, CommonModule, SearchResearchResultsServiceModule, PagingModule, SearchCrossrefServiceModule,
SearchDataciteServiceModule, HelperModule, SearchFilterModule, ClaimResultsModule, MatSelectModule, QuickSelectionsModule, RangeFilterModule], SearchDataciteServiceModule, HelperModule, SearchFilterModule, ClaimResultsModule, MatSelectModule, QuickSelectionsModule, RangeFilterModule, ClaimProjectsSearchFormModule],
providers:[ providers:[
SearchOrcidService SearchOrcidService
], ],

16
claims/claim-utils/claimResults.component.ts
View File

@ -7,10 +7,10 @@ declare var UIkit: any;
selector: 'claim-results', selector: 'claim-results',
template: ` template: `
<ul *ngIf="results.length > 0 " class="uk-list uk-list-divider"> <div *ngIf="results.length > 0 " class="uk-padding">
<li *ngFor=" let entity of results " [class]="(isSelected(entity))?'uk-block-muted':''"> <div *ngFor=" let entity of results " [class]="(isSelected(entity))?'uk-block-muted':''" class=" uk-card uk-card-default uk-padding-small uk-margin-bottom">
<div> <div>
<div class="uk-text-muted"> <div class="uk-text-small">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}} {{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div> </div>
<div class="uk-grid"> <div class="uk-grid">
@ -19,8 +19,8 @@ declare var UIkit: any;
<claim-result-metadata [entity]="entity"></claim-result-metadata> <claim-result-metadata [entity]="entity"></claim-result-metadata>
<claim-project-metadata [entity]="entity"></claim-project-metadata> <claim-project-metadata [entity]="entity"></claim-project-metadata>
</div> </div>
<div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left" [title]="(this.selectedResults.length>=basketLimit)?'Basket reached the size limit':''"> <div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left uk-margin-small-right" [title]="(this.selectedResults.length>=basketLimit)?'Basket reached the size limit':''">
<a [class]="(this.selectedResults.length>=basketLimit)?'uk-icon-button uk-disabled':'uk-icon-button'" *ngIf="!isSelected(entity)" <a [class]="(this.selectedResults.length>=basketLimit)?'uk-icon-button uk-disabled':'uk-icon-button '" *ngIf="!isSelected(entity)"
(click)="add(entity)"> (click)="add(entity)">
<span class="uk-icon"> <span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus"
@ -28,7 +28,7 @@ declare var UIkit: any;
height="1"></rect></svg> height="1"></rect></svg>
</span> </span>
</a> </a>
<span *ngIf="isSelected(entity)" class="uk-icon-button portal-icon-button"> <span *ngIf="isSelected(entity)" class="uk-icon-button uk-button-primary ">
<span class="uk-icon" > <span class="uk-icon" >
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="check" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.1" points="4,10 8,15 17,4"></polyline></svg> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="check" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.1" points="4,10 8,15 17,4"></polyline></svg>
</span> </span>
@ -37,8 +37,8 @@ declare var UIkit: any;
</div> </div>
</div> </div>
</li> </div>
</ul>`, </div>`,
}) })
export class ClaimResultsComponent { export class ClaimResultsComponent {

31
claims/linking/insertClaim/insertClaim.component.ts
View File

@ -20,9 +20,10 @@ import {Subscriber} from "rxjs";
selector: 'claim-insert', selector: 'claim-insert',
template: ` template: `
<div (click)="insert()"
<div class="uk-width-1-1"> class=" nextStep uk-margin-small-top uk-padding-small uk-text-center " [class.active]="(results.length > 0 && (sources.length > 0 || inlineEntity))" [class.disabled]="!(results.length > 0 && (sources.length > 0 || inlineEntity))">
<modal-loading [message]="'Please wait...'"></modal-loading>
<modal-loading [message]="'Please wait...'"></modal-loading>
<modal-alert (alertOutput)="confirmClose()"> <modal-alert (alertOutput)="confirmClose()">
<h4 class="modal-title uk-text-bold " id="myModalLabel">Confirmation notice</h4> <h4 class="modal-title uk-text-bold " id="myModalLabel">Confirmation notice</h4>
<p>All the links you provided will be published in the OpenAIRE platform. <br> <p>All the links you provided will be published in the OpenAIRE platform. <br>
@ -34,19 +35,11 @@ import {Subscriber} from "rxjs";
Do you confirm the information you provide is valid? Do you confirm the information you provide is valid?
</p> </p>
</modal-alert> </modal-alert>
<div class="uk-clearfix">
<div> <div>
<div *ngIf="!claiming " (click)="insert()" style="width: 350px;" <span >CONFIRM LINKING
[class]="getButtonClass()">CONFIRM LINKING <span class="uk-icon uk-text-bold uk-margin-small-right" uk-icon="arrow-right"></span>
<span [class]="(defaultColors?'':' uk-margin-small-top ')+'uk-icon uk-float-right uk-text-bold uk-margin-small-right'"> </span>
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
icon="chevron-right" ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03"
points="7 4 13 10 7 16"></polyline></svg>
</span>
</div>
</div>
</div> </div>
</div> </div>
` `
@ -93,7 +86,9 @@ export class ClaimInsertComponent {
private errorInRecords = []; private errorInRecords = [];
public insert() { public insert() {
this.confirmOpen(); if(this.claiming) {
this.confirmOpen();
}
} }
saveAndNavigate(){ saveAndNavigate(){
localStorage.setItem(this.localStoragePrefix + "results", JSON.stringify(this.results)); localStorage.setItem(this.localStoragePrefix + "results", JSON.stringify(this.results));
@ -524,9 +519,7 @@ export class ClaimInsertComponent {
} }
if(this.defaultColors){ if(this.defaultColors){
buttonClass+=" linksbaskettitles uk-padding-small "; buttonClass+=" linksbaskettitles uk-padding-small ";
}else{ }
buttonClass+=" uk-button uk-button-large ";
}
return buttonClass + "uk-text-center "; return buttonClass + "uk-text-center ";
} }
} }

0
claims/linking/linkingGeneric.component.css Normal file
View File

266
claims/linking/linkingGeneric.component.html
View File

@ -1,3 +1,21 @@
<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
<stepper>
<step [status]="stepStatus('source')" stepId="source" stepNumber="1"
[stepText]="'Find Sources'" (stepChanged)="stepHasChanged($event)"
[active]="this.showOptions.show" [showStepLine]="false"></step>
<!-- <step-line [status]="stepStatus('source')"></step-line>-->
<step [status]="stepStatus('target')" stepId="target" [stepNumber]="inlineEntity?1:2"
[stepText]="'Link Source' + (inlineEntity?'':'s') + ' to Entities'"
(stepChanged)="stepHasChanged($event)" [active]="this.showOptions.show"
[showStepLine]="true"></step>
<!-- <step-line [status]="stepStatus('target')"></step-line>-->
<step [status]="stepStatus('claim')" stepId="claim" [stepNumber]="inlineEntity?2:3"
[stepText]="'Summarize and finish'"
(stepChanged)="stepHasChanged($event)" [active]="this.showOptions.show"
[showStepLine]="true"></step>
</stepper>
<metadata-preview *ngIf="showOptions.show=='claim' && properties" class="uk-margin-top" <metadata-preview *ngIf="showOptions.show=='claim' && properties" class="uk-margin-top"
[results]="results" [sources]="sources" [results]="results" [sources]="sources"
[localStoragePrefix]="localStoragePrefix" [inlineEntity]="inlineEntity" [localStoragePrefix]="localStoragePrefix" [inlineEntity]="inlineEntity"
@ -11,11 +29,8 @@
<schema2jsonld *ngIf="url" [URL]="url" name="Link your research outcomes" type="other"></schema2jsonld> <schema2jsonld *ngIf="url" [URL]="url" name="Link your research outcomes" type="other"></schema2jsonld>
<div [class]="((showOptions.show == 'claim')?'':' uk-margin-top ')+' uk-container uk-container-large '"> <div [class]="((showOptions.show == 'claim')?'':' uk-margin-top ')+' uk-container uk-container-large '">
<div> <div>
<!-- <div class="uk-width-1-1">
<helper position="top"></helper>
</div> -->
<div class="uk-grid helper-grid"> <div class="uk-grid helper-grid">
<!-- <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>-->
<div class="uk-width-expand"> <div class="uk-width-expand">
<div *ngIf="properties" class="uk-section uk-section-default white-box-with-border uk-padding-small uk-padding-remove-top"> <div *ngIf="properties" class="uk-section uk-section-default white-box-with-border uk-padding-small uk-padding-remove-top">
@ -24,58 +39,8 @@
[class]="((showOptions.show == 'claim')?'':' uk-margin-top ')+' uk-container uk-container-large '"> [class]="((showOptions.show == 'claim')?'':' uk-margin-top ')+' uk-container uk-container-large '">
<div id="basketStickTop"></div> <div id="basketStickTop"></div>
<div class="uk-grid" *ngIf="showOptions.show!='claim'" > <div class="uk-grid" *ngIf="showOptions.show!='claim'" >
<div class="uk-width-2-3"> <div class="uk-width-2-3 uk-padding">
<div class="uk-margin-small-bottom">
<!-- <div *ngIf="showOptions.show!='source' && showOptions.show != 'claim' && showOptions.linkToEntities.length > 1">-->
<!-- <mat-form-field class="matSelectionFormField">-->
<!-- <mat-label>Sort by:</mat-label>-->
<!-- <mat-select [(ngModel)]="showOptions.show" class="uk-width-auto uk-text-bold matSelection"-->
<!-- *ngIf="showOptions.linkToEntities.length > 1"-->
<!-- [disableOptionCentering]="true"-->
<!-- panelClass="matSelectionPanel">-->
<!-- <mat-option *ngIf="showOptions.linkToEntities.indexOf('project')!=-1 "-->
<!-- value="project">PROJECTS</mat-option>-->
<!-- <mat-option *ngIf="showOptions.linkToEntities.indexOf('result')!=-1 " value="result">RESEARCH-->
<!-- RESULTS</mat-option>-->
<!-- <mat-option *ngIf="showOptions.linkToEntities.indexOf('context')!=-1 " value="context">COMMUNITIES-->
<!-- </mat-option>-->
<!-- </mat-select>-->
<!-- </mat-form-field>-->
<!-- </div>-->
<span *ngIf="showOptions.show!='source' && showOptions.show != 'claim' && showOptions.linkToEntities.length > 1"
class="uk-flex-inline uk-flex-middle uk-width-3-5@m uk-width-1-1@s">
<span class="uk-width-1-4 uk-text-muted uk-text-large">LINK TO </span>
<mat-select [(ngModel)]="showOptions.show" class="uk-width-3-4@m matSelection"
*ngIf="showOptions.linkToEntities.length > 1"
[disableOptionCentering]="true"
panelClass="matSelectionPanel">
<mat-option *ngIf="showOptions.linkToEntities.indexOf('project')!=-1 "
value="project">PROJECTS</mat-option>
<mat-option *ngIf="showOptions.linkToEntities.indexOf('result')!=-1 " value="result">RESEARCH
RESULTS</mat-option>
<mat-option *ngIf="showOptions.linkToEntities.indexOf('context')!=-1 " value="context">COMMUNITIES
</mat-option>
</mat-select>
</span>
<span *ngIf="showOptions.show!='source' && showOptions.show != 'claim' && showOptions.linkToEntities.length ==1">
<span>LINK TO </span>
<span class=" uk-width-auto uk-text-bold">
<span *ngIf="showOptions.linkToEntities.indexOf('project')!=-1 "
value="project">PROJECTS</span>
<span *ngIf="showOptions.linkToEntities.indexOf('result')!=-1 " value="result">RESEARCH
RESULTS</span>
<span *ngIf="showOptions.linkToEntities.indexOf('context')!=-1 " value="context">COMMUNITIES
</span>
</span>
</span>
<span *ngIf="showOptions.show=='source'" class="uk-text-bold">
ADD LINKING SOURCES
</span>
</div>
<div *ngIf="showOptions.show=='source'"> <div *ngIf="showOptions.show=='source'">
<claim-result-search-form [selectedResults]="sources" [properties]=properties <claim-result-search-form [selectedResults]="sources" [properties]=properties
[localStoragePrefix]="localStoragePrefix+'sources'" [basketLimit]="basketLimit" [localStoragePrefix]="localStoragePrefix+'sources'" [basketLimit]="basketLimit"
@ -83,64 +48,55 @@
</div> </div>
<div *ngIf="showOptions.show=='project'"> <div *ngIf="showOptions.show=='project'">
<claim-projects-search-form [selectedProjects]="results" [properties]=properties <claim-projects-search-form [selectedProjects]="results" [properties]=properties
[localStoragePrefix]="localStoragePrefix+'results'" [basketLimit]="basketLimit" [localStoragePrefix]="localStoragePrefix+'results'"
[basketLimit]="basketLimit" [showOptions]="showOptions"
></claim-projects-search-form> ></claim-projects-search-form>
</div> </div>
<div *ngIf="showOptions.show=='context'"> <div *ngIf="showOptions.show=='context'">
<claim-contexts-search-form [communityId]=communityId [results]="results" [sources]="sources" <claim-contexts-search-form [communityId]=communityId [results]="results" [sources]="sources"
[properties]=properties [properties]=properties
[localStoragePrefix]="localStoragePrefix+'results'" [basketLimit]="basketLimit" [localStoragePrefix]="localStoragePrefix+'results'"
[basketLimit]="basketLimit" [showOptions]="showOptions"
></claim-contexts-search-form> ></claim-contexts-search-form>
</div> </div>
<div *ngIf="showOptions.show=='result'"> <div *ngIf="showOptions.show=='result'">
<claim-result-search-form [selectedResults]="results" [properties]=properties <claim-result-search-form [selectedResults]="results" [properties]=properties
[localStoragePrefix]="localStoragePrefix+'results'" [basketLimit]="basketLimit" [localStoragePrefix]="localStoragePrefix+'results'"
[basketLimit]="basketLimit" [showOptions]="showOptions"
></claim-result-search-form> ></claim-result-search-form>
</div> </div>
</div> </div>
<!-- Basket--> <!-- Basket-->
<div *ngIf="showOptions.show != 'claim'" class="uk-width-1-3" style="" > <div *ngIf="showOptions.show != 'claim'" class="uk-width-1-3 uk-padding-remove-left "
style="" >
<div id="basket" uk-sticky=" offset: 130; top:#basketStickTop; bottom: #basketStickBottom;" <div id="basket" uk-sticky=" offset: 130; top:#basketStickTop; bottom: #basketStickBottom;"
style="z-index: 0"> style="z-index: 0" class="uk-card uk-card-default linkingBasket">
<h6 class="linksbasketheader uk-margin-bottom uk-text-bold">
LINKS BASKET
</h6>
<div class="linksbasket uk-inline uk-width-1-1" style=""> <div class="linksbasket uk-inline uk-width-1-1" style="">
<div *ngIf="inlineEntity == null"> <div>
<div class="linksbaskettitles uk-padding-small uk-animation-toggle" <ul class="uk-padding-small uk-padding-remove-bottom" uk-tab>
(click)="showOptions.showBasketSources()" <li
[style.cursor]="(showOptions.show!='source'?'pointer':'default')"> [class.uk-active]="showOptions.basketShowSources"
<div class="uk-h6 uk-margin-remove portal-color" > (click)="showOptions.basketswitchToSources()"><a
SOURCES ({{(sources.length) | number}}) href="#">Sources to
<span *ngIf="showOptions.show!='source' && !showOptions.basketShowSources" link
class="uk-icon"><svg width="20" ({{(sources.length + (inlineEntity?1:0)) |
height="20" number}})
viewBox="0 0 20 20" </a></li>
xmlns="http://www.w3.org/2000/svg" <li [class.uk-disabled]="sources.length == 0" [class.uk-active]="showOptions.basketShowLinksTo"
icon="chevron-left" (click)="showOptions.basketswitchToLinkTo()"><a href="#">Link to <span
ratio="1"><polyline *ngIf="results.length
fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> > 0">(
<span *ngIf="showOptions.show!='source' && showOptions.basketShowSources" {{(results.length) | number}})</span></a></li>
class="uk-icon"><svg width="20" </ul>
height="20" <ul class="uk-switcher" >
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" <li>
icon="chevron-down"
ratio="1"><polyline <div
fill="none" stroke="#000" stroke-width="1.03" points="16 7 10 13 4 7"></polyline></svg></span>
</div>
Research results to link
</div>
<div *ngIf="showOptions.basketShowSources"
class=" uk-margin-remove-top uk-height-medium uk-overflow-auto "> class=" uk-margin-remove-top uk-height-medium uk-overflow-auto ">
<div class="uk-background-muted uk-padding-small " style="min-height: 17px;"> <div *ngIf="showOptions.show == 'source'" class=" uk-padding-small " style="min-height:
<div *ngIf="showOptions.show != 'source'" class="uk-text-center"> 17px;">
<a (click)="showOptions.showSource()">
<!--span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span-->
Edit sources</a>
</div>
<start-over *ngIf="showOptions.show == 'source' && (sources.length)> 0" <start-over *ngIf="showOptions.show == 'source' && (sources.length)> 0"
[results]="sources" [results]="sources"
[localStoragePrefix]="localStoragePrefix+'sources'" [localStoragePrefix]="localStoragePrefix+'sources'"
@ -154,83 +110,32 @@
</div> </div>
<div class="uk-animation-slide-top-small uk-padding-small"> <div class="uk-animation-slide-top-small uk-padding-small">
<div *ngIf="(sources.length) == 0 " class="uk-alert no-selected-message uk-text-center"> <div *ngIf="(sources.length) == 0 && !inlineEntity " class=" uk-text-center">
No Sources added yet. Start adding sources from the left panel. Or upload a DOI's CSV file. No Sources added yet. Start adding sources from the left panel. Or upload a DOI's CSV file.
</div> </div>
<div *ngIf="sources.length >= basketLimit " <div *ngIf="sources.length >= basketLimit "
class="uk-alert uk-alert-warning uk-text-center"> class="uk-alert uk-alert-warning uk-text-center">
Basket reached the size limit. No more sources can be added. Basket reached the size limit. No more sources can be added.
</div> </div>
<claim-selected-results [results]="sources" <claim-selected-results *ngIf="inlineEntity" [results]="[inlineEntity]"
[localStoragePrefix]="localStoragePrefix+'sources'" class="" [localStoragePrefix]="localStoragePrefix+'sources'" class=""
[enableRemove]="showOptions.show == 'source'"> [enableRemove]="false" type="source" >
</claim-selected-results> </claim-selected-results>
<div id="test1"></div> <claim-selected-results *ngIf="sources.length > 0" [results]="sources"
</div> [localStoragePrefix]="localStoragePrefix+'sources'" class=""
[enableRemove]="true" type="source">
</claim-selected-results>
</div>
</div> </div>
</div>
<div *ngIf="inlineEntity" </li>
class="linkInlineEntity uk-padding-small">
<div class="uk-h6 linkInlineEntity uk-margin-small-bottom "> <li>
SOURCE <div >
<div
</div>
<claim-title [entity]="inlineEntity" [slice]="true" [sliceSize]="45"
[shortVersion]="true"></claim-title>
<div class="uk-margin-small-top">
<span class="uk-label custom-label linkInlineEntityLabel"
title="Type">{{inlineEntity.type}}</span>
<span *ngIf="inlineEntity.project">
<span class="uk-label custom-label linkInlineEntityLabel"
title="Funder">{{inlineEntity.project.funderName}}</span>
<!-- <span class="uk-label custom-label " title="Type">{{inlineEntity.type}}</span>-->
</span>
<span *ngIf="inlineEntity.result">
<span class="uk-label custom-label linkInlineEntityLabel "
title="Access mode">{{inlineEntity.result.accessRights}}</span>
</span>
</div>
</div>
<div *ngIf="showOptions.show !='source'">
<div class=" linksbaskettitles uk-padding-small uk-animation-toggle" (click)="showOptions.basketShowLinksTo=!showOptions.basketShowLinksTo;
showOptions.basketShowSources=!showOptions.basketShowLinksTo ">
<div *ngIf="!inlineEntity"> <!--Enable toggle -->
<span class="uk-h6 uk-margin-remove portal-color" >
LINK TO ({{(results.length) | number}})
<span *ngIf="!showOptions.basketShowLinksTo" 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 *ngIf="showOptions.basketShowLinksTo" class="uk-icon"><svg width="20"
height="20"
viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
icon="chevron-down"
ratio="1"><polyline
fill="none" stroke="#000" stroke-width="1.03"
points="16 7 10 13 4 7"></polyline></svg></span>
</span>
</div>
<div *ngIf="inlineEntity"> <!--Inline Entity - no toggle -->
<span class="uk-h6 uk-margin-remove portal-color">
LINK TO ({{(results.length) | number}})
</span>
</div>
<div class="linksBasketSubtitles">
Entities to link with the sources
</div>
</div>
<div *ngIf="showOptions.basketShowLinksTo"
class="uk-height-medium uk-overflow-auto"> class="uk-height-medium uk-overflow-auto">
<div *ngIf=" (results.length)> 0 || showOptions.show=='result'" <div *ngIf=" (results.length)> 0 || showOptions.show=='result'"
class="uk-background-muted uk-padding-small " style="min-height: 17px;"> class=" uk-padding-small " style="min-height: 17px;">
<start-over *ngIf=" (results.length)> 0" <start-over *ngIf=" (results.length)> 0"
[results]="results" [localStoragePrefix]="localStoragePrefix+'results'" [results]="results" [localStoragePrefix]="localStoragePrefix+'results'"
message="all results (projects, communities, research results)" message="all results (projects, communities, research results)"
@ -245,9 +150,9 @@
Basket reached the size limit. No more entities can be added. Basket reached the size limit. No more entities can be added.
</div> </div>
<claim-selected-results sectionTitle="Selected Results" [results]="results" <claim-selected-results sectionTitle="Selected Results" [results]="results"
[localStoragePrefix]="localStoragePrefix+'results'"> [localStoragePrefix]="localStoragePrefix+'results'" type="target">
</claim-selected-results> </claim-selected-results>
<div *ngIf="(results.length) == 0 " class="uk-alert no-selected-message uk-text-center"> <div *ngIf="(results.length) == 0 " class=" uk-text-center">
No entities to link with the sources. Start adding entities from the left panel. No entities to link with the sources. Start adding entities from the left panel.
</div> </div>
@ -255,31 +160,28 @@
</div> </div>
</div> </div>
</li>
</div> </ul>
<div *ngIf="showOptions.show=='source'" <div *ngIf="showOptions.show=='source'"
[class]="((sources.length)>0?'linksbaskettitlesPortalColor ':'uk-disabled')+ ' linksbaskettitles uk-padding-small'" class=" nextStep uk-margin-small-top uk-padding-small " [class.active]="(sources.length)>0" [class.disabled]="(sources.length) == 0"
(click)="openSelectionModal(); "> (click)="stepHasChanged('target') ">
<!--show = linkTo; basketShowSources=false; <div class=" uk-margin-remove uk-text-center">
basketShowLinksTo=true;--> STEP 2 - LINK SOURCES TO ENTITIES
<div class="uk-h6 uk-margin-remove portal-color">CONTINUE TO - LINK TO <span
*ngIf="results.length > 0">({{(results.length) | number}})</span>
<span class="uk-icon uk-float-right uk-text-bold uk-margin-small-right"> <span class="uk-icon uk-float-right uk-text-bold uk-margin-small-right">
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" <svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
icon="chevron-right" ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03" icon="chevron-right" ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03"
points="7 4 13 10 7 16"></polyline></svg> points="7 4 13 10 7 16"></polyline></svg>
</span> </span>
</div> </div>
<div class="linksBasketSubtitles">
Entities to link with the sources
</div>
</div> </div>
<div *ngIf="showOptions.show!='source'" <div *ngIf="showOptions.show!='source'"
[class]="((results.length)>0?'linksbaskettitlesPortalColor ':'uk-disabled')+ ' linksbaskettitles uk-margin-small-top uk-padding-small'" class=" nextStep uk-margin-small-top uk-padding-small " [class.active]="(results.length)>0" [class.disabled]="(results.length) == 0"
style="height:auto !important; " (click)="showOptions.show = 'claim'; scrollUp();"> style="height:auto !important; " (click)="stepHasChanged('claim')">
<div class="uk-margin-remove portal-color uk-text-center"> <div class="uk-margin-remove uk-text-center">
FINISH LINKING STEP {{inlineEntity?'2':'3'}} - FINALISE AND FINISH
<span class="uk-icon uk-float-right uk-text-bold uk-margin-small-right"> <span class="uk-icon uk-float-right uk-text-bold uk-margin-small-right">
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" <svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
icon="chevron-right" ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03" icon="chevron-right" ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03"
@ -290,6 +192,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="basketStickBottom"></div> <div id="basketStickBottom"></div>
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper> <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper>
</div> </div>
@ -308,7 +211,8 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<modal-alert (alertOutput)="closeSelectionModal($event)" > <modal-alert (alertOutput)="closeSelectionModal($event)" >
<div class="uk-grid uk-text-center uk-margin-expand uk-padding uk-child-width-1-3"> <div class="uk-grid uk-text-center uk-margin-expand uk-padding uk-child-width-1-3">

67
claims/linking/linkingGeneric.component.ts
View File

@ -1,4 +1,4 @@
import {Component, Input, ViewChild} from '@angular/core'; import {ChangeDetectorRef, Component, Input, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router'; import {ActivatedRoute, Router} from '@angular/router';
import {Meta, Title} from '@angular/platform-browser'; import {Meta, Title} from '@angular/platform-browser';
import {EnvProperties} from '../../utils/properties/env-properties'; import {EnvProperties} from '../../utils/properties/env-properties';
@ -11,12 +11,15 @@ import {HelperService} from "../../utils/helper/helper.service";
import {PiwikService} from "../../utils/piwik/piwik.service"; import {PiwikService} from "../../utils/piwik/piwik.service";
import {Subscriber} from "rxjs"; import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment"; import {properties} from "../../../../environments/environment";
import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
import {MetricsService} from "../../services/metrics.service";
declare var UIkit:any; declare var UIkit:any;
@Component({ @Component({
selector: 'linking-generic', selector: 'linking-generic',
templateUrl: 'linkingGeneric.component.html' templateUrl: 'linkingGeneric.component.html',
styleUrls:[ 'linkingGeneric.component.css']
}) })
export class LinkingGenericComponent { export class LinkingGenericComponent {
@ -43,19 +46,23 @@ export class LinkingGenericComponent {
url=null; url=null;
@ViewChild(AlertModal) alert; @ViewChild(AlertModal) alert;
public pageContents = null; public pageContents = null;
@Input() breadcrumbs: Breadcrumb[] = [];
constructor (private _router: Router, private route: ActivatedRoute, private entitySearch:EntitiesSearchService, constructor (private _router: Router, private route: ActivatedRoute, private entitySearch:EntitiesSearchService,
private _meta: Meta, private _title: Title, private _piwikService:PiwikService, private _meta: Meta, private _title: Title, private _piwikService:PiwikService,
private seoService: SEOService, private helper: HelperService ) { private seoService: SEOService, private helper: HelperService, private cdr: ChangeDetectorRef ) {
} }
subscriptions = []; subscriptions = [];
ngOnInit() { ngOnInit() {
if(this.breadcrumbs.length === 0) {
this.breadcrumbs.push({name: 'home', route: '/'});
this.breadcrumbs.push({name: "Link", route: null});
}
this.showOptions.show = 'source'; this.showOptions.show = 'source';
if(this.inlineEntity){ if(this.inlineEntity){
this.showOptions.basketShowSources = false; this.showOptions.showLinkTo();
this.showOptions.basketShowLinksTo = true; // this.showOptions.basketShowLinksTo = true;
this.showOptions.show = this.showOptions.linkTo; this.showOptions.show = this.showOptions.linkTo;
} }
@ -141,4 +148,52 @@ export class LinkingGenericComponent {
private updateUrl(url:string) { private updateUrl(url:string) {
this._meta.updateTag({content:url},"property='og:url'"); this._meta.updateTag({content:url},"property='og:url'");
} }
stepHasChanged(stepId){
if(stepId == 'source'){
console.log("show source")
this.showOptions.showSource();
}else if(stepId == 'target'){
console.log("show target")
this.showOptions.show = this.showOptions.linkTo;
this.showOptions.showLinkTo();
}else if(stepId == 'claim'){
console.log("show target")
this.showOptions.show = 'claim';
}
this.cdr.detectChanges();
console.log('stepHasChanged', stepId, this.showOptions.show)
}
stepStatus(stepId){
if(stepId == 'source'){
if(this.showOptions.show == 'source'){
return 'active';
}else if(this.sources.length > 0){
return 'done';
}else{
return 'default';
}
}else if(stepId=='target'){
if(this.showOptions.show != 'source' && this.showOptions.show != 'claim'){
return 'active';
}else if(this.results.length > 0){
return 'done';
}else if(this.sources.length == 0){
return 'disabled';
}else{
return 'default';
}
}else if(stepId=='claim'){
if(this.showOptions.show == 'claim'){
return 'active';
}else if(this.results.length > 0 && (this.inlineEntity || this.sources.length > 0)){
return 'default';
}else if(!(this.results.length > 0 && (this.inlineEntity || this.sources.length > 0))){
return 'disabled';
}
}
}
} }

6
claims/linking/linkingGeneric.module.ts
View File

@ -21,16 +21,18 @@ import {MetadataPreviewModule} from './selected/metadataPreview.module';
import {ClaimEntitiesMetadataModule} from "./selected/ClaimEntitiesMetadata.module"; import {ClaimEntitiesMetadataModule} from "./selected/ClaimEntitiesMetadata.module";
import {AlertModalModule} from '../../utils/modal/alertModal.module'; import {AlertModalModule} from '../../utils/modal/alertModal.module';
import {PiwikServiceModule} from "../../utils/piwik/piwikService.module"; import {PiwikServiceModule} from "../../utils/piwik/piwikService.module";
import {BreadcrumbsModule} from "../../utils/breadcrumbs/breadcrumbs.module";
import {StepperModule} from "../../sharedComponents/stepper/stepper.module";
@NgModule({ @NgModule({
imports: [ imports: [
SharedModule, SelectedProjectsModule, SelectedContextsModule, SharedModule, SelectedProjectsModule, SelectedContextsModule,
SelectedPublicationsModule, SelectedPublicationsModule,
StartOverModule, StartOverModule,
ClaimContextSearchFormModule, ClaimProjectsSearchFormModule, BulkClaimModule, ClaimResultSearchFormModule, ClaimContextSearchFormModule, ClaimProjectsSearchFormModule, BulkClaimModule, ClaimResultSearchFormModule,
HelperModule, Schema2jsonldModule, SEOServiceModule, MetadataPreviewModule, ClaimEntitiesMetadataModule, AlertModalModule, HelperModule, Schema2jsonldModule, SEOServiceModule, MetadataPreviewModule, ClaimEntitiesMetadataModule, AlertModalModule,
PiwikServiceModule, PiwikServiceModule,
MatSelectModule MatSelectModule, BreadcrumbsModule, StepperModule
], ],
providers:[LoginGuard, PreviousRouteRecorder, IsRouteEnabled], providers:[LoginGuard, PreviousRouteRecorder, IsRouteEnabled],
declarations: [ declarations: [

10
claims/linking/selected/ClaimEntityProjectMetadata.component.ts
View File

@ -8,16 +8,16 @@ import {ClaimEntity} from '../../claim-utils/claimHelper.class';
<div *ngIf="entity.type == 'project' && entity.project" class="uk-grid uk-margin-remove-top uk-text-small"> <div *ngIf="entity.type == 'project' && entity.project" class="uk-grid uk-margin-remove-top uk-text-small">
<div class="uk-width-1-2"> <div class="uk-width-1-2">
<div *ngIf="entity.project.funderName"> <div *ngIf="entity.project.funderName">
<span class="uk-text-muted">Funder </span>{{entity.project.funderName}} <span class="uk-text-meta uk-margin-small-right">Funder: </span>{{entity.project.funderName}}
</div>
<div *ngIf="entity.project.code">
<span class="uk-text-meta uk-margin-small-right">GrandID: </span>{{entity.project.code}}
</div> </div>
</div> </div>
<div class="uk-width-1-2"> <div class="uk-width-1-2">
<div *ngIf="entity.project.code">
<span class="uk-text-muted">GrandId </span>{{entity.project.code}}
</div>
<div *ngIf=" !shortVersion && (entity.project.startDate || entity.project.endDate)"> <div *ngIf=" !shortVersion && (entity.project.startDate || entity.project.endDate)">
<span <span
class="uk-text-muted">Duration </span>{{(entity.project.startDate) ? entity.project.startDate : 'Unknown'}}{{'-' + ((entity.project.endDate) ? entity.project.endDate : 'Unknown')}} class="uk-text-meta uk-margin-small-right">Duration: </span>{{(entity.project.startDate) ? entity.project.startDate : 'Unknown'}}{{'-' + ((entity.project.endDate) ? entity.project.endDate : 'Unknown')}}
</div> </div>
</div> </div>
</div> </div>

16
claims/linking/selected/ClaimEntityResultMetadata.component.ts
View File

@ -6,23 +6,23 @@ import {ClaimEntity} from '../../claim-utils/claimHelper.class';
template: template:
` `
<div *ngIf="entity.result"> <div *ngIf="entity.result">
<div *ngIf="entity.result.authors && entity.result.authors.length >0 " class="uk-text-small"> <div *ngIf="entity.result.authors && entity.result.authors.length >0 " class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Authors </span> <span class="uk-text-meta uk-margin-small-right">Authors: </span>
{{sliceArray(entity.result.authors)}} {{sliceArray(entity.result.authors)}}
</div> </div>
<div *ngIf="!shortVersion && entity.result.editors&& entity.result.editors.length > 0" class="uk-text-small"> <div *ngIf="!shortVersion && entity.result.editors&& entity.result.editors.length > 0" class="uk-text-small uk-margin-small-bottom">
<span class="uk-text-muted">Editors </span> <span class="uk-text-meta uk-margin-small-right">Editors: </span>
{{sliceArray(entity.result.editors)}} {{sliceArray(entity.result.editors)}}
</div> </div>
<div *ngIf="!shortVersion" class="uk-grid uk-margin-remove uk-text-small"> <div *ngIf="!shortVersion" class="uk-grid uk-margin-remove uk-text-small">
<div class="uk-width-1-2 uk-padding-remove-left"> <div class="uk-width-1-2 uk-padding-remove-left ">
<span *ngIf="entity.result.publisher!=null"><span <span *ngIf="entity.result.publisher!=null"><span
class="uk-text-muted">Publisher</span> {{entity.result.publisher}}</span> class="uk-text-meta uk-margin-small-right uk-margin-small-bottom">Publisher: </span> {{entity.result.publisher}}</span>
<span *ngIf="entity.result.journal!=null"><span <span *ngIf="entity.result.journal!=null"><span
class="uk-text-muted">Journal</span> {{entity.result.journal}}</span> class="uk-text-meta uk-margin-small-right uk-margin-small-bottom">Journal: </span> {{entity.result.journal}}</span>
</div> </div>
<div class="uk-width-1-2"> <div class="uk-width-1-2">
<span *ngIf="entity.result.date"><span class="uk-text-muted">Published in </span> <span <span *ngIf="entity.result.date"><span class="uk-text-meta uk-margin-small-right uk-margin-small-bottom">Published: </span> <span
[class]="(getProjectDurationMessage(entity)?'uk-text-warning':'')">{{entity.result.date}}</span></span> [class]="(getProjectDurationMessage(entity)?'uk-text-warning':'')">{{entity.result.date}}</span></span>
<div [class]="(getProjectDurationMessage(entity)?'uk-text-warning':'')">{{getProjectDurationMessage(entity)}} <div [class]="(getProjectDurationMessage(entity)?'uk-text-warning':'')">{{getProjectDurationMessage(entity)}}
</div> </div>

14
claims/linking/selected/ClaimEntityTitle.component.ts
View File

@ -6,14 +6,15 @@ import {StringUtils} from "../../../utils/string-utils.class";
selector: 'claim-title', selector: 'claim-title',
template: template:
` `
<span class="uk-text-bold"> <div class="uk-grid uk-flex uk-flex-middle">
<a *ngIf="entity.result && entity.result.url" target="_blank" [href]="entity.result.url" <div class="uk-width-expand" [class.uk-h6]="!shortVersion" [class.uk-text-bold]="shortVersion" [class.uk-text-truncate]="shortVersion" [class.uk-margin-bottom]="!shortVersion" [class.uk-margin-small-bottom]="shortVersion">
class="uk-link">{{entity.title ? sliceString(entity.title) : '[No title available]'}}</a> <a *ngIf="entity.result && entity.result.url" target="_blank" [href]="entity.result.url"
class="uk-text-link">{{entity.title ? sliceString(entity.title) : '[No title available]'}}</a>
<span <span
*ngIf="(entity.result && !entity.result.url)">{{entity.title ? sliceString(entity.title) : '[No title available]'}}</span> *ngIf="(entity.result && !entity.result.url)">{{entity.title ? sliceString(entity.title) : '[No title available]'}}</span>
<span *ngIf="entity.type=='project' && entity.project"> <span *ngIf="entity.type=='project' && entity.project">
<a *ngIf="entity.project && entity.project.url" target="_blank" [href]="entity.project.url" <a *ngIf="entity.project && entity.project.url" target="_blank" [href]="entity.project.url"
class="uk-link"> class="uk-text-link">
<span *ngIf="!shortVersion"> <span *ngIf="!shortVersion">
{{(entity.project.acronym ? '[' + entity.project.acronym + '] ' : '') + entity.title}} {{(entity.project.acronym ? '[' + entity.project.acronym + '] ' : '') + entity.title}}
</span> </span>
@ -39,7 +40,8 @@ import {StringUtils} from "../../../utils/string-utils.class";
</span> </span>
<span> {{entity.context.concept.label}}</span> <span> {{entity.context.concept.label}}</span>
</span> </span>
</span> </div>
</div>
` `
@ -58,7 +60,7 @@ export class ClaimEntityTitleComponent {
} }
sliceString(mystr:string): string { sliceString(mystr:string): string {
if(this.slice){ if(this.slice){
return StringUtils.sliceString(mystr,this.sliceSize); // return StringUtils.sliceString(mystr,this.sliceSize);
} }
return mystr; return mystr;
} }

698
claims/linking/selected/metadataPreview.component.html
View File

@ -1,34 +1,4 @@
<div class="uk-section uk-padding-remove-top uk-padding-remove-bottom ">
<div
[class]="((defaultColors)?'linkingToolbar':'communityPanelBackground')+' uk-padding-small'">
<div class="uk-container uk-container-large uk-margin-small-top uk-padding-small">
<div class="uk-grid">
<div class="uk-padding-remove-left uk-margin-auto-vertical back uk-link">
<span
(click)="showOptions.showLinkTo()"
style="cursor:pointer">
<span class="uk-icon">
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left"
ratio="1.5"><polyline fill="none" stroke="#000" stroke-width="1.03"
points="13 16 7 10 13 4"></polyline></svg></span>
BACK
</span>
</div>
<div class="uk-width-expand">
<h6 class="uk-text-bold">
LINKING CONFIRMATION
</h6>
Confirm that the links you provided are all correct
</div>
<claim-insert [results]="results" [sources]="sources" [inlineEntity]="inlineEntity"
[properties]=properties [localStoragePrefix]=localStoragePrefix
class=" " [errors]="errors" (insertFinished)="runValidation(false); updateLocalStorage();"
[defaultColors]="defaultColors" [communityId]="communityId">
</claim-insert>
</div>
</div>
</div>
</div>
<div id="tm-main" class="uk-section uk-margin-small-top tm-middle uk-padding-remove-top"> <div id="tm-main" class="uk-section uk-margin-small-top tm-middle uk-padding-remove-top">
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first "> <div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
@ -39,402 +9,353 @@
<div class="uk-margin-top"> <div class="uk-margin-top">
<div class="uk-grid"> <div class="uk-grid ">
<div class="uk-width-expand"> <div
<div> class=" uk-width-expand uk-padding-remove-left">
<div class=" uk-margin uk-h6 uk-text-primary uk-animation-toggle" <div
(click)="showSources=!showSources; "> class="uk-card uk-card-default uk-width-expand uk-padding ">
SOURCES ({{sources.length + (inlineEntity ? 1 : 0) | number}}) <div
<span *ngIf="!showSources" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" class=" uk-grid uk-grid-divider uk-child-width-1-2@m uk-child-width-1-1@s uk-padding-remove-left ">
xmlns="http://www.w3.org/2000/svg" icon="chevron-left" <!-- Sources-->
ratio="1"><polyline fill="none" stroke="#000" <div class="">
stroke-width="1.03" <div class=" uk-margin uk-animation-toggle">
points="13 16 7 10 13 4"></polyline></svg></span> <span class="uk-h6 "> SOURCES ({{sources.length + (inlineEntity ? 1 : 0) | number}})
<span *ngIf="showSources" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" </span>
xmlns="http://www.w3.org/2000/svg" icon="chevron-down" <a *ngIf="!inlineEntity" class="uk-float-right" (click)="showOptions.showSource() "> <span
ratio="1"><polyline fill="none" stroke="#000" uk-icon="pencil"></span>Edit
stroke-width="1.03" sources</a>
points="16 7 10 13 4 7"></polyline></svg></span>
</div>
<ul *ngIf="inlineEntity && showSources" class="uk-list uk-animation-fade">
<li
[class]="((inlineEntity.warningMessages.length > 0)?' warningBorder ':'')+
+((inlineEntity.errorMessages.length > 0)?' dangerBorder ':'') +
' uk-alert'" >
<div class="uk-grid uk-text-small">
<div class="uk-text-muted uk-width-1-2">
{{(!inlineEntity.result) ? inlineEntity.type : ((inlineEntity.result && inlineEntity.result.source == 'openaire') ? inlineEntity.type : (inlineEntity.result && inlineEntity.result.source + ' result'))}}
</div>
<div *ngIf="inlineEntity.errorMessages.length > 0"
class="uk-text-danger uk-width-1-2"> Link couldn't be saved
</div>
</div>
<!-- <div class="uk-text-muted">-->
<!-- {{(!inlineEntity.result) ? inlineEntity.type : ((inlineEntity.result && inlineEntity.result.source == 'openaire') ? inlineEntity.type : (inlineEntity.result && inlineEntity.result.source + ' result'))}}-->
<!-- </div>-->
<div>
<claim-title [entity]="inlineEntity"></claim-title>
</div>
<claim-result-metadata [entity]="inlineEntity"></claim-result-metadata>
<claim-project-metadata [entity]="inlineEntity"></claim-project-metadata>
</li>
</ul>
<div *ngIf="!inlineEntity && sources.length == 0 && showSources">
<div class="uk-alert dangerBorder no-selected-message uk-text-center">
<span class="uk-text-bold uk-text-danger"> SOURCES cannot be empty.</span>
Start by adding your linking sources first, go to <a (click)="showOptions.showSource() " class="uk-link">
sources
page</a>.
</div> </div>
</div> <ul *ngIf="inlineEntity" class="uk-list uk-animation-fade uk-list-divider">
<ul *ngIf="!inlineEntity && sources.length > 0 && showSources" class="uk-list uk-animation-fade"> <li>
<li *ngFor=" let entity of sources " <div class="uk-grid uk-text-small">
[class]="((entity.warningMessages.length > 0)?' warningBorder ':'')+ <div class="uk-text-muted uk-width-1-2">
+((entity.errorMessages.length > 0)?' dangerBorder ':'') + {{(!inlineEntity.result) ? inlineEntity.type : ((inlineEntity.result && inlineEntity.result.source == 'openaire') ? inlineEntity.type : (inlineEntity.result && inlineEntity.result.source + ' result'))}}
' uk-alert'"> </div>
<!-- <div class="uk-text-muted">--> <div *ngIf="inlineEntity.errorMessages.length > 0"
<!-- {{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}--> class="uk-text-danger uk-width-1-2"> Link couldn't be saved
<!-- </div>--> </div>
<div class="uk-grid uk-text-small">
<div class="uk-text-muted uk-width-1-2">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div> </div>
<div *ngIf="entity.errorMessages.length > 0" <!-- <div class="uk-text-muted">-->
class="uk-text-danger uk-width-1-2"> Link couldn't be saved <!-- {{(!inlineEntity.result) ? inlineEntity.type : ((inlineEntity.result && inlineEntity.result.source == 'openaire') ? inlineEntity.type : (inlineEntity.result && inlineEntity.result.source + ' result'))}}-->
</div> <!-- </div>-->
</div> <div class="uk-grid uk-flex uk-flex-middle">
<div class="uk-grid uk-margin-remove-top"> <div>
<div class="uk-width-expand"> <span class="material-icons uk-text-small uk-text-meta">insert_drive_file</span>
<claim-title [entity]="entity"></claim-title> <!-- <span class="material-icons uk-text-small uk-text-meta">assignment_turned_in</span>-->
<claim-result-metadata [entity]="entity"></claim-result-metadata> </div>
<claim-project-metadata [entity]="entity"></claim-project-metadata> <div class="uk-width-expand uk-padding-remove-left uk-margin-small-left">
<div *ngIf="entity.result && entity.result.source && entity.result.source!='openaire' " <div>
class="uk-grid uk-margin-remove-left uk-margin-small-top uk-text-small"> <claim-title [shortVersion]="true" [entity]="inlineEntity"></claim-title>
<div class="uk-width-1-2 uk-padding-remove-left"> </div>
<!-- <span class="uk-text-muted">Type </span>--> <claim-result-metadata [entity]="inlineEntity"></claim-result-metadata>
<!-- <mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}"--> <claim-project-metadata [entity]="inlineEntity"></claim-project-metadata>
<!-- class="uk-select uk-width-small matSelection"--> </div>
<!-- [disableOptionCentering]="true"--> </div>
<!-- panelClass="entitiesSelectionPanel">--> </li>
<!-- <mat-option [value]="'publication'"--> </ul>
<!-- (click)="onTypeChanged('publication',entity, false)">Publication-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'dataset'"-->
<!-- (click)="onTypeChanged('dataset',entity, false)">Research data-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'other'"-->
<!-- (click)="onTypeChanged('other',entity, false)">Other research product-->
<!-- </mat-option>-->
<!-- </mat-select>-->
<mat-form-field class="matSelectionFormField"> <div *ngIf="!inlineEntity && sources.length == 0 ">
<mat-label>Type</mat-label>
<mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}" <div class="uk-alert dangerBorder no-selected-message uk-text-center">
class="matSelection" <span class="uk-text-bold uk-text-danger"> SOURCES cannot be empty.</span><br>
Start by adding your linking sources first, go to <a (click)="showOptions.showSource() " class="uk-link">
step 1</a>.
</div>
</div>
<ul *ngIf="!inlineEntity && sources.length > 0 " class="uk-list uk-animation-fade uk-list-divider">
<li *ngFor=" let entity of sources ">
<!-- <div class="uk-text-muted">-->
<!-- {{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}-->
<!-- </div>-->
<div class="uk-grid uk-text-small">
<div class="uk-text-muted uk-width-1-2">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div>
<div *ngIf="entity.errorMessages.length > 0"
class="uk-text-danger uk-width-1-2"> Link couldn't be saved
</div>
</div>
<div class="uk-grid uk-margin-remove-top">
<div>
<span class="material-icons uk-text-small uk-text-meta">insert_drive_file</span>
<!-- <span class="material-icons uk-text-small uk-text-meta">assignment_turned_in</span>-->
</div>
<div class="uk-width-expand uk-padding-remove-left uk-margin-small-left">
<claim-title [shortVersion]="true" [entity]="entity"></claim-title>
<claim-result-metadata [entity]="entity"></claim-result-metadata>
<claim-project-metadata [entity]="entity"></claim-project-metadata>
<div *ngIf="entity.result && entity.result.source && entity.result.source!='openaire' "
class="uk-grid uk-margin-remove-left uk-margin-small-top uk-text-small">
<div class="uk-width-1-2 uk-padding-remove-left">
<!-- <span class="uk-text-muted">Type </span>-->
<!-- <mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}"-->
<!-- class="uk-select uk-width-small matSelection"-->
<!-- [disableOptionCentering]="true"-->
<!-- panelClass="entitiesSelectionPanel">-->
<!-- <mat-option [value]="'publication'"-->
<!-- (click)="onTypeChanged('publication',entity, false)">Publication-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'dataset'"-->
<!-- (click)="onTypeChanged('dataset',entity, false)">Research data-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software-->
<!-- </mat-option>-->
<!-- <mat-option [value]="'other'"-->
<!-- (click)="onTypeChanged('other',entity, false)">Other research product-->
<!-- </mat-option>-->
<!-- </mat-select>-->
<mat-form-field class="matSelectionFormField">
<mat-label>Type</mat-label>
<mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}"
class="matSelection"
[disableOptionCentering]="true"
panelClass="entitiesSelectionPanel">
<mat-option [value]="'publication'"
(click)="onTypeChanged('publication',entity, false)">Publication
</mat-option>
<mat-option [value]="'dataset'"
(click)="onTypeChanged('dataset',entity, false)">Research data
</mat-option>
<mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software
</mat-option>
<mat-option [value]="'other'"
(click)="onTypeChanged('other',entity, false)">Other research product
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="uk-width-1-2">
<div class="uk-grid">
<!-- <span class="uk-text-muted uk-margin-small-top uk-padding-remove-left">Access mode</span>-->
<mat-form-field class="matSelectionFormField">
<mat-label>Access mode </mat-label>
<mat-select [(ngModel)]="entity.result.accessRights" name="{{'select_rights_'+entity.id}}"
class="uk-padding-remove-left matSelection"
[disableOptionCentering]="true" [disableOptionCentering]="true"
panelClass="entitiesSelectionPanel"> panelClass="matSelectionPanel">
<mat-option *ngFor="let type of accessTypes" [value]="type"
(click)="accessRightsTypeChanged(type,entity, false)">{{type}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="entity.result.accessRights== 'EMBARGO'">
<input matInput [matDatepicker]="picker" placeholder="Choose embargo end date"
(click)="picker.open()" [ngModel]="embargoEndDates[entity.id+'_source']"
(dateInput)="onDateChanged($event, entity, false)" (dateChange)="onDateChanged($event, entity, false)">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker [startAt]="embargoEndDates[entity.id+'_source']" ng-model-options="{ timezone: 'utc' }"></mat-datepicker>
</mat-form-field>
</div>
<div *ngIf="entity.result.accessRights== 'EMBARGO' && getEmbargoEndDateMessage(entity)"
[class]="(getEmbargoEndDateMessage(entity)?'uk-text-warning':'')">{{getEmbargoEndDateMessage(entity)}}
</div>
</div>
</div>
</div>
<div class=" uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left">
<a class=" uk-link "
(click)="remove(entity, false)">
<span uk-icon="close"> </span>
</a>
</div>
</div>
</li>
</ul>
</div>
<!-- Results-->
<div class=" ">
<div class=" uk-margin " >
<span class=" uk-h6 "> LINK TO ({{results.length | number}})</span>
<a class="uk-float-right" (click)="showOptions.showLinkTo()"> <span
uk-icon="pencil"></span>Edit
entities</a>
</div>
<div *ngIf="results.length == 0">
<div class="uk-alert dangerBorder no-selected-message uk-text-center">
<span class="uk-text-bold uk-text-danger"> LINK TO list cannot be empty.</span><br>
Start by adding sources to link to first, go to <a (click)="showOptions.showLinkTo() "
class="uk-link">
step 2</a>.
</div>
</div>
<ul *ngIf="results.length > 0 " class="uk-list uk-animation-fade uk-list-divider">
<li *ngFor=" let entity of results "
style="z-index: 0 !important;">
<div class="uk-grid uk-text-small">
<div class="uk-text-muted uk-width-1-2">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div>
<div *ngIf="entity.errorMessages.length > 0"
class="uk-text-danger uk-width-1-2"> Link couldn't be saved
</div>
</div>
<div class="uk-grid uk-margin-remove-top">
<div class="uk-width-expand">
<claim-title [shortVersion]="true" [entity]="entity"></claim-title>
<claim-result-metadata [entity]="entity"></claim-result-metadata>
<claim-project-metadata [entity]="entity"></claim-project-metadata>
<div *ngIf="entity.result && entity.result.source && entity.result.source!='openaire' "
class="uk-grid uk-text-small uk-margin-remove-left uk-margin-small-top">
<div class="uk-width-1-2 uk-padding-remove-left">
<!-- <span class="uk-text-muted">Type </span>-->
<mat-form-field class="matSelectionFormField">
<mat-label>Type</mat-label>
<mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}"
class=" matSelection"
[disableOptionCentering]="true"
panelClass="matSelectionPanel">
<mat-option [value]="'publication'" <mat-option [value]="'publication'"
(click)="onTypeChanged('publication',entity, false)">Publication (click)="onTypeChanged('publication',entity, false)">Publication
</mat-option> </mat-option>
<mat-option [value]="'dataset'" <mat-option [value]="'dataset'"
(click)="onTypeChanged('dataset',entity, false)">Research data (click)="onTypeChanged('dataset',entity, false)">Research data
</mat-option> </mat-option>
<mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software <mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software
</mat-option> </mat-option>
<mat-option [value]="'other'" <mat-option [value]="'other'"
(click)="onTypeChanged('other',entity, false)">Other research product (click)="onTypeChanged('other',entity, false)">Other research product
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div>
</div> <div class="uk-width-1-2">
<div class="uk-width-1-2"> <div class="uk-grid">
<div class="uk-grid"> <!-- <span class="uk-text-muted uk-margin-small-top uk-padding-remove-left">Access mode</span>-->
<!-- <span class="uk-text-muted uk-margin-small-top uk-padding-remove-left">Access mode</span>--> <mat-form-field class="matSelectionFormField">
<mat-form-field class="matSelectionFormField"> <mat-label>Access mode </mat-label>
<mat-label>Access mode </mat-label>
<mat-select [(ngModel)]="entity.result.accessRights" name="{{'select_rights_'+entity.id}}" <mat-select [(ngModel)]="entity.result.accessRights" name="{{'select_rights_'+entity.id}}"
class="uk-padding-remove-left matSelection" class=" uk-padding-remove-left matSelection"
[disableOptionCentering]="true" [disableOptionCentering]="true"
panelClass="matSelectionPanel"> panelClass="matSelectionPanel">
<mat-option *ngFor="let type of accessTypes" [value]="type" <mat-option *ngFor="let type of accessTypes" [value]="type"
(click)="accessRightsTypeChanged(type,entity, false)">{{type}}</mat-option> (click)="accessRightsTypeChanged(type,entity, true)">{{type}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="entity.result.accessRights== 'EMBARGO'"> <mat-form-field *ngIf="entity.result.accessRights== 'EMBARGO'">
<input matInput [matDatepicker]="picker" placeholder="Choose embargo end date" <input matInput [matDatepicker]="picker" placeholder="Choose embargo end date"
(click)="picker.open()" [ngModel]="embargoEndDates[entity.id+'_source']" (click)="picker.open()" [ngModel]="embargoEndDates[entity.id+'_result']"
(dateInput)="onDateChanged($event, entity, false)" (dateChange)="onDateChanged($event, entity, false)"> (dateInput)="onDateChanged($event, entity, true)"
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle> (dateChange)="onDateChanged($event, entity, true)">
<mat-datepicker #picker [startAt]="embargoEndDates[entity.id+'_source']" ng-model-options="{ timezone: 'utc' }"></mat-datepicker> <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
</mat-form-field> <mat-datepicker #picker [startAt]="embargoEndDates[entity.id+'_result']" ng-model-options="{ timezone: 'utc' }"></mat-datepicker>
</div> </mat-form-field>
<div *ngIf="entity.result.accessRights== 'EMBARGO' && getEmbargoEndDateMessage(entity)" </div>
[class]="(getEmbargoEndDateMessage(entity)?'uk-text-warning':'')">{{getEmbargoEndDateMessage(entity)}} <div *ngIf="entity.result.accessRights== 'EMBARGO' && getEmbargoEndDateMessage(entity)"
[class]="(getEmbargoEndDateMessage(entity)?'uk-text-warning':'')">{{getEmbargoEndDateMessage(entity)}}
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left">
<a class="uk-link "
(click)="remove(entity, true)">
<span uk-icon="close"> </span>
</a>
</div>
</div> </div>
<div class=" uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left">
<a class=" uk-icon-button "
(click)="remove(entity, false)"> </li>
<span class="uk-icon"> </ul>
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" </div>
ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg>
</span>
</a>
</div>
</div>
</li>
</ul>
</div> </div>
<!-- Results--> </div>
<div> <div class="uk-section uk-padding-remove-top uk-padding-remove-bottom uk-width-1-1 uk-padding-remove-left ">
<div class=" uk-margin uk-h6 uk-text-primary "
(click)="showLinksTo=!showLinksTo; ">
LINK TO ({{results.length | number}})
<span *ngIf="!showLinksTo" 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 *ngIf="showLinksTo" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
icon="chevron-down" ratio="1"><polyline
fill="none" stroke="#000" stroke-width="1.03" points="16 7 10 13 4 7"></polyline></svg></span>
<claim-insert [results]="results" [sources]="sources" [inlineEntity]="inlineEntity"
[properties]=properties [localStoragePrefix]=localStoragePrefix
class=" " [errors]="errors" (insertFinished)="runValidation(false); updateLocalStorage();"
[defaultColors]="defaultColors" [communityId]="communityId">
</claim-insert>
</div>
</div>
<div class="uk-width-1-3" *ngIf="errors.length > 0 || warnings.length > 0">
<!-- Errors and Warning -->
<div *ngIf="errors.length > 0" class=" uk-margin uk-h6 uk-text-danger uk-animation-toggle" >
ERRORS ({{errors.length | number}})
</div> </div>
<div *ngIf="results.length == 0 && showLinksTo"> <div *ngIf="errors.length > 0 " class="">
<div class="uk-alert dangerBorder no-selected-message uk-text-center"> <div *ngFor=" let message of errors " class="uk-alert uk-alert-danger">
<span class="uk-text-bold uk-text-danger"> LINK TO list cannot be empty.</span> <div *ngIf="message.type == 'claimServiceFail2Insert'">
Select an entity type to link to: <div class="">
<div class="uk-grid uk-text-center uk-margin-expand uk-padding-small uk-child-width-1-3 uk-width-large uk-margin-auto ">
<span class=" uk-text-bold"> Fail to save {{message.failed|number}}
<div *ngIf="showOptions.linkToEntities.indexOf('project')!=-1 " {{message.failed > 1 ? 'links.' : 'link.'}}</span>
(click)="goTo('project')" <br>
style="cursor:pointer;"> <div
<button class="uk-icon-button portal-button"> *ngIf="message.inserted>0">But {{message.inserted|number}} link{{message.inserted > 1 ? 's' : ''}} was
<span class="uk-icon"> successfully inserted.
<svg height="20" icon="album" ratio="1" viewBox="0 0 20 20" width="20" <div>
xmlns="http://www.w3.org/2000/svg"><rect height="1" width="10" x="5" y="2"></rect><rect <a routerLinkActive="router-link-active" routerLink="/myclaims">Manage your links here</a>
height="1" width="14" x="3" y="4"></rect><rect fill="none" height="11" stroke="#000"
width="17" x="1.5" y="6.5"></rect></svg></span>
</button>
<div>Projects</div>
</div>
<div *ngIf="showOptions.linkToEntities.indexOf('result')!=-1 " (click)="goTo('result')"
style="cursor:pointer;">
<button class="uk-icon-button portal-button">
<span class="uk-icon">
<svg height="20" icon="copy" ratio="1" viewBox="0 0 20 20" width="20"
xmlns="http://www.w3.org/2000/svg"><rect fill="none" height="16" stroke="#000"
width="12" x="3.5" y="2.5"></rect><polyline
fill="none" points="5 0.5 17.5 0.5 17.5 17" stroke="#000"></polyline></svg></span>
</button>
<div>Research results</div>
</div>
<div *ngIf="showOptions.linkToEntities.indexOf('context')!=-1 "
(click)="goTo('context')"
style="cursor:pointer;">
<button class="uk-icon-button portal-button">
<span class="uk-icon">
<svg height="20" icon="users" ratio="1" viewBox="0 0 20 20" width="20"
xmlns="http://www.w3.org/2000/svg"><circle cx="7.7" cy="8.6" fill="none" r="3.5"
stroke="#000" stroke-width="1.1"></circle><path
d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3" fill="none"
stroke="#000" stroke-width="1.1"></path><path
d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"
fill="none" stroke="#000" stroke-width="1.1"></path></svg></span>
</button>
<div>Communities</div>
</div>
</div>
</div>
</div>
<ul *ngIf="results.length > 0 && showLinksTo" class="uk-list uk-animation-fade">
<li *ngFor=" let entity of results "
[class]="((entity.warningMessages.length > 0)?' warningBorder ':'')+
+((entity.errorMessages.length > 0)?' dangerBorder ':'') +
' uk-alert'" style="z-index: 0 !important;">
<div class="uk-grid uk-text-small">
<div class="uk-text-muted uk-width-1-2">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div>
<div *ngIf="entity.errorMessages.length > 0"
class="uk-text-danger uk-width-1-2"> Link couldn't be saved
</div>
</div>
<div class="uk-grid uk-margin-remove-top">
<div class="uk-width-expand">
<claim-title [entity]="entity"></claim-title>
<claim-result-metadata [entity]="entity"></claim-result-metadata>
<claim-project-metadata [entity]="entity"></claim-project-metadata>
<div *ngIf="entity.result && entity.result.source && entity.result.source!='openaire' "
class="uk-grid uk-text-small uk-margin-remove-left uk-margin-small-top">
<div class="uk-width-1-2 uk-padding-remove-left">
<!-- <span class="uk-text-muted">Type </span>-->
<mat-form-field class="matSelectionFormField">
<mat-label>Type</mat-label>
<mat-select [(ngModel)]="entity.type" name="{{'select_type_'+entity.id}}"
class=" matSelection"
[disableOptionCentering]="true"
panelClass="matSelectionPanel">
<mat-option [value]="'publication'"
(click)="onTypeChanged('publication',entity, false)">Publication
</mat-option>
<mat-option [value]="'dataset'"
(click)="onTypeChanged('dataset',entity, false)">Research data
</mat-option>
<mat-option [value]="'software'" (click)="onTypeChanged('software',entity, false)">Software
</mat-option>
<mat-option [value]="'other'"
(click)="onTypeChanged('other',entity, false)">Other research product
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="uk-width-1-2">
<div class="uk-grid">
<!-- <span class="uk-text-muted uk-margin-small-top uk-padding-remove-left">Access mode</span>-->
<mat-form-field class="matSelectionFormField">
<mat-label>Access mode </mat-label>
<mat-select [(ngModel)]="entity.result.accessRights" name="{{'select_rights_'+entity.id}}"
class=" uk-padding-remove-left matSelection"
[disableOptionCentering]="true"
panelClass="matSelectionPanel">
<mat-option *ngFor="let type of accessTypes" [value]="type"
(click)="accessRightsTypeChanged(type,entity, true)">{{type}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="entity.result.accessRights== 'EMBARGO'">
<input matInput [matDatepicker]="picker" placeholder="Choose embargo end date"
(click)="picker.open()" [ngModel]="embargoEndDates[entity.id+'_result']"
(dateInput)="onDateChanged($event, entity, true)"
(dateChange)="onDateChanged($event, entity, true)">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker [startAt]="embargoEndDates[entity.id+'_result']" ng-model-options="{ timezone: 'utc' }"></mat-datepicker>
</mat-form-field>
</div>
<div *ngIf="entity.result.accessRights== 'EMBARGO' && getEmbargoEndDateMessage(entity)"
[class]="(getEmbargoEndDateMessage(entity)?'uk-text-warning':'')">{{getEmbargoEndDateMessage(entity)}}
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left">
<a class="uk-icon-button "
(click)="remove(entity, true)">
<span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus"
ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg>
</span>
</a>
</div>
</div> </div>
<div *ngIf="message.type == 'claimServiceFail'">
</li>
</ul> <div class="">
</div> <span class=" uk-text-bold"> An error occured while saving your links.</span>
</div> <br>
<div class="uk-width-1-3" *ngIf="errors.length > 0 || warnings.length > 0"> None of the links saved.
<!-- Errors and Warning -->
<div *ngIf="errors.length > 0" class=" uk-margin uk-h6 uk-text-primary uk-animation-toggle"
(click)="showErrors=!showErrors ">
ERRORS ({{errors.length | number}})
<span *ngIf="!showErrors" 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 *ngIf="showErrors" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg"
icon="chevron-down" ratio="1"><polyline
fill="none" stroke="#000" stroke-width="1.03" points="16 7 10 13 4 7"></polyline></svg></span>
</div>
<div *ngIf="errors.length > 0 && showErrors" class=" uk-animation-fade">
<div *ngFor=" let message of errors " class="uk-alert dangerBorder">
<div *ngIf="message.type == 'claimServiceFail2Insert'">
<div class="">
<span class="uk-text-danger uk-text-bold"> Fail to save {{message.failed|number}}
{{message.failed > 1 ? 'links.' : 'link.'}}</span>
<br>
<div
*ngIf="message.inserted>0">But {{message.inserted|number}} link{{message.inserted > 1 ? 's' : ''}} was
successfully inserted.
<div>
<a routerLinkActive="router-link-active" routerLink="/myclaims">Manage your links here</a>
</div>
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="message.type == 'claimServiceFail'">
<div class="">
<span class="uk-text-danger uk-text-bold"> An error occured while saving your links.</span>
<br>
None of the links saved.
</div>
</div>
</div> </div>
</div> <div *ngIf="warnings.length > 0"
<div *ngIf="warnings.length > 0" class=" uk-margin uk-h6 uk-text-warning uk-animation-toggle"> WARNINGS
class=" uk-margin uk-h6 uk-text-primary uk-animation-toggle" ({{warnings.length
(click)="showWarnings=!showWarnings "> WARNINGS | number}})
({{warnings.length
| number}}) </div>
<span *ngIf="!showWarnings" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" <div *ngIf="warnings.length > 0 " class="">
icon="chevron-left" ratio="1"><polyline <div *ngFor=" let message of warnings " class="uk-alert uk-alert-warning">
fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> <div *ngIf="message.type == 'embargoEndDate'">
<span *ngIf="showWarnings" class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" <div class="uk-text-bold">
xmlns="http://www.w3.org/2000/svg" Embargo date must be later than published date in
icon="chevron-down" ratio="1"><polyline </div>
fill="none" stroke="#000" stroke-width="1.03" points="16 7 10 13 4 7"></polyline></svg></span> <div class="">
</div> {{message.resultTitle}}
</div>
<div *ngIf="warnings.length > 0 && showWarnings " class=" uk-animation-fade">
<div *ngFor=" let message of warnings " class="uk-alert warningBorder">
<div *ngIf="message.type == 'embargoEndDate'">
<div class="uk-text-warning uk-text-bold">
Embargo date must be later than published date in
</div> </div>
<div class=""> <div *ngIf="message.type == 'projectDuration'">
{{message.resultTitle}} <div class="uk-text-bold">
Published date must be in the project's date boundaries
(from {{message.projectInfo.startDate}}{{(message.projectInfo.endDate) ? (' to ' + (addStringToNumber(message.projectInfo.endDate, 5))) : ''}}) in
</div>
<div class="">
{{message.resultTitle}}
</div>
<div class="uk-text-muted uk-text-small">
with link to
</div>
<div class="">
{{message.projectInfo.title}}
</div>
<div><span class="uk-text-muted uk-text-small">
Project boundaries: </span>({{message.projectInfo.startDate}}{{(message.projectInfo.endDate) ? (' - ' + (message.projectInfo.endDate) + ') +5 years') : ')'}}
</div>
</div> </div>
</div> </div>
<div *ngIf="message.type == 'projectDuration'">
<div class="uk-text-warning uk-text-bold">
Published date must be in the project's date boundaries
(from {{message.projectInfo.startDate}}{{(message.projectInfo.endDate) ? (' to ' + (addStringToNumber(message.projectInfo.endDate, 5))) : ''}}) in
</div>
<div class="">
{{message.resultTitle}}
</div>
<div class="uk-text-muted uk-text-small">
with link to
</div>
<div class="">
{{message.projectInfo.title}}
</div>
<div><span class="uk-text-muted uk-text-small">
Project boundaries: </span>({{message.projectInfo.startDate}}{{(message.projectInfo.endDate) ? (' - ' + (message.projectInfo.endDate) + ') +5 years') : ')'}}
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<modal-alert (alertOutput)="confirmClose()"> <modal-alert (alertOutput)="confirmClose()">
</modal-alert> </modal-alert>
</div> </div>
@ -444,10 +365,11 @@
</div> </div>
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper> <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper>
</div> </div>
</div> </div>
</div>

12
claims/linking/selected/metadataPreview.component.ts
View File

@ -12,10 +12,10 @@ import {HelperFunctions} from "../../../utils/HelperFunctions.class";
}) })
export class MetadataPreviewComponent { export class MetadataPreviewComponent {
showSources = true; /* showSources = true;
showLinksTo = true; showLinksTo = true;*/
showErrors = true; // showErrors = true;
showWarnings = true; // showWarnings = true;
@Input() results: ClaimEntity[]; @Input() results: ClaimEntity[];
@Input() sources: ClaimEntity[]; @Input() sources: ClaimEntity[];
@Input() title: string = "Research Results"; @Input() title: string = "Research Results";
@ -40,10 +40,10 @@ export class MetadataPreviewComponent {
ngOnInit() { ngOnInit() {
this.setEmbargoEndDates(); this.setEmbargoEndDates();
if (this.inlineEntity) { /* if (this.inlineEntity) {
this.showSources = true; this.showSources = true;
this.showLinksTo = true; this.showLinksTo = true;
} }*/
this.runValidation(true); this.runValidation(true);
} }
setEmbargoEndDates(){ setEmbargoEndDates(){

17
claims/linking/selected/metadataPreview.module.ts
View File

@ -10,16 +10,17 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select'; import { MatSelectModule } from '@angular/material/select';
import {HelperModule} from "../../../utils/helper/helper.module"; import {HelperModule} from "../../../utils/helper/helper.module";
import {SelectedPublicationsModule} from "./selectedResults.module";
@NgModule({ @NgModule({
imports: [ imports: [
SharedModule, SharedModule,
AlertModalModule, AlertModalModule,
ClaimEntitiesMetadataModule, ClaimEntitiesMetadataModule,
InsertClaimsModule, InsertClaimsModule,
MatDatepickerModule, MatNativeDateModule, MatFormFieldModule, MatInputModule, MatSelectModule, MatDatepickerModule, MatNativeDateModule, MatFormFieldModule, MatInputModule, MatSelectModule,
HelperModule HelperModule, SelectedPublicationsModule
], ],
declarations: [MetadataPreviewComponent], declarations: [MetadataPreviewComponent],
exports:[MetadataPreviewComponent] exports:[MetadataPreviewComponent]
}) })

24
claims/linking/selected/selectedResults.component.html
View File

@ -1,19 +1,21 @@
<ul *ngIf="results.length > 0 " class="uk-list uk-list-divider"> <ul *ngIf="results.length > 0 " class="uk-list uk-list-divider">
<li *ngFor=" let entity of results " > <li *ngFor=" let entity of results " >
<div class="uk-text-muted"> <!--<div class="uk-text-muted">
{{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}} {{(!entity.result) ? entity.type : ((entity.result && entity.result.source == 'openaire') ? entity.type : (entity.result && entity.result.source + ' result'))}}
</div> </div>-->
<div class="uk-grid"> <div class="uk-grid uk-flex uk-flex-middle">
<div class="uk-width-expand"> <div >
<claim-title [entity]="entity" [slice]="true" [sliceSize]="45" [shortVersion]="true"></claim-title> <span *ngIf="type == 'source'" class="material-icons uk-text-small uk-text-meta">insert_drive_file</span>
<claim-result-metadata [entity]="entity" [slice]="true" [sliceSize]="5" [shortVersion]="true"></claim-result-metadata> <span *ngIf="type == 'target'" class="material-icons uk-text-small uk-text-meta">assignment_turned_in</span>
<claim-project-metadata [entity]="entity" [slice]="true" [sliceSize]="5" [shortVersion]="true"></claim-project-metadata> </div>
<div class="uk-width-expand uk-padding-remove-left uk-margin-small-left">
<claim-title [entity]="entity" [slice]="true" [sliceSize]="45" [shortVersion]="shortVersion"></claim-title>
<claim-result-metadata [entity]="entity" [slice]="true" [sliceSize]="5" [shortVersion]="shortVersion"></claim-result-metadata>
<claim-project-metadata [entity]="entity" [slice]="true" [sliceSize]="5" [shortVersion]="shortVersion"></claim-project-metadata>
</div> </div>
<div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left" *ngIf="enableRemove"> <div class="uk-margin-auto-vertical uk-padding-remove-left uk-margin-small-left" *ngIf="enableRemove">
<a class=" uk-icon-button " (click)="remove(entity)" > <a class=" uk-link " (click)="remove(entity)" >
<span class="uk-icon" > <span uk-icon="close"> </span>
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg>
</span>
</a> </a>
</div> </div>
</div> </div>

3
claims/linking/selected/selectedResults.component.ts
View File

@ -11,7 +11,8 @@ export class ClaimSelectedResultsComponent {
@Input() sectionTitle: string = "Research Results"; @Input() sectionTitle: string = "Research Results";
@Input() localStoragePrefix: string = ""; @Input() localStoragePrefix: string = "";
@Input() enableRemove:boolean = true; @Input() enableRemove:boolean = true;
@Input() type: "source" | "target";
@Input() shortVersion:boolean = true;
ngOnInit() { ngOnInit() {
} }

2
connect/connectHelper.ts
View File

@ -6,7 +6,7 @@ export class ConnectHelper {
public static getCommunityFromDomain(domain: string): string{ public static getCommunityFromDomain(domain: string): string{
if(properties.environment == "development") { if(properties.environment == "development") {
// domain = "aginfra.openaire.eu"; //for testing domain = "covid-19.openaire.eu"; //for testing
} }
domain = domain.indexOf("//") != -1? domain.split("//")[1]:domain; //remove https:// prefix domain = domain.indexOf("//") != -1? domain.split("//")[1]:domain; //remove https:// prefix
if (domain.indexOf('eosc-portal.eu') != -1) { if (domain.indexOf('eosc-portal.eu') != -1) {

12
searchPages/searchUtils/searchFilter.component.html
View File

@ -12,7 +12,7 @@
</div> </div>
</div> </div>
<div *ngIf="addShowMore && (filter.values.length) > filterValuesNum"> <div *ngIf="addShowMore && (filter.values.length) > filterValuesNum">
<a [class]="((isDisabled)?'uk-disabled uk-link-muted ':'uk-link') + ' uk-margin-small-top'" (click)="toggle()"> <a *ngIf="filterValuesNum > 0 " [class]="((isDisabled)?'uk-disabled uk-link-muted ':'uk-link') + ' uk-margin-small-top'" (click)="toggle()">
<span *ngIf="!isOpen">+ View all</span> <span *ngIf="!isOpen">+ View all</span>
</a> </a>
<div *ngIf="isOpen" class="uk-text-small uk-margin-small-bottom"> <div *ngIf="isOpen" class="uk-text-small uk-margin-small-bottom">
@ -29,13 +29,13 @@
<span *ngIf="showResultCount === true" <span *ngIf="showResultCount === true"
class="uk-width-1-3@m uk-width-2-5@s uk-padding-small uk-padding-remove-vertical uk-padding-remove-right"> class="uk-width-1-3@m uk-width-2-5@s uk-padding-small uk-padding-remove-vertical uk-padding-remove-right">
<span class="uk-width-1-4 uk-text-muted"> Sort by:</span> <span class="uk-width-1-4 uk-text-muted"> Sort by:</span>
<select [(ngModel)]="sortBy" <!-- <select [(ngModel)]="sortBy"
class=" uk-width-expand uk-select uk-hidden@m uk-form-small" class=" uk-width-expand uk-select uk-hidden@m uk-form-small"
id="form-horizontal-select" name="select_order"> id="form-horizontal-select" name="select_order">
<option value="num">Results number</option> <option value="num">Results number</option>
<option value="name">Name</option> <option value="name">Name</option>
</select> </select>-->
<mat-select [(ngModel)]="sortBy" <mat-select [(ngModel)]="sortBy" (ngModelChange)="sort(filter.values)"
class="uk-width-expand matSelection uk-visible@m" class="uk-width-expand matSelection uk-visible@m"
id="form-horizontal-select1" name="select_order" id="form-horizontal-select1" name="select_order"
[disableOptionCentering]="true" panelClass="matSelectionPanel"> [disableOptionCentering]="true" panelClass="matSelectionPanel">
@ -48,7 +48,7 @@
<div class="uk-overflow-auto uk-height-max-small uk-padding-remove <div class="uk-overflow-auto uk-height-max-small uk-padding-remove
uk-margin-small-left uk-margin-small-right uk-margin-small-top uk-width-1-1"> uk-margin-small-left uk-margin-small-right uk-margin-small-top uk-width-1-1">
<ng-container *ngFor="let value of sort(filter.values)"> <ng-container *ngFor="let value of this.sortedValues">
<div *ngIf="filterKeywords(value.name)" title="{{value.name}}" <div *ngIf="filterKeywords(value.name)" title="{{value.name}}"
class="uk-animation-fade filterItem searchFilterItem uk-text-small"> class="uk-animation-fade filterItem searchFilterItem uk-text-small">
<ng-container <ng-container
@ -57,7 +57,7 @@
</ng-container> </ng-container>
</div> </div>
</div> </div>
<a [class]="(isDisabled)?'uk-disabled uk-link-muted ':'uk-link'" (click)="toggle()"> <a *ngIf="filterValuesNum > 0 && filterValuesNum !=0" [class]="(isDisabled)?'uk-disabled uk-link-muted ':'uk-link'" (click)="toggle()">
<span *ngIf="isOpen">- View less</span> <span *ngIf="isOpen">- View less</span>
</a> </a>
</div> </div>

15
searchPages/searchUtils/searchFilter.component.ts
View File

@ -32,14 +32,14 @@ export class SearchFilterComponent implements OnInit, OnChanges {
@Output() modalChange = new EventEmitter(); @Output() modalChange = new EventEmitter();
@Output() onFilterChange = new EventEmitter(); @Output() onFilterChange = new EventEmitter();
keyword = ""; keyword = "";
sortBy = "name"; sortBy: "name" | "num" = "name";
queryParams = {}; queryParams = {};
paramPosition = 0; paramPosition = 0;
@Input() actionRoute: boolean = false; @Input() actionRoute: boolean = false;
@Input() quickFilter: { filter: Filter, selected: boolean, filterId: string, value: string }; @Input() quickFilter: { filter: Filter, selected: boolean, filterId: string, value: string };
sub; sub;
public isOpen: boolean = false; public isOpen: boolean = false;
sortedValues;
constructor(private _router: Router, private route: ActivatedRoute) { constructor(private _router: Router, private route: ActivatedRoute) {
} }
@ -50,11 +50,18 @@ export class SearchFilterComponent implements OnInit, OnChanges {
} }
ngOnInit() { ngOnInit() {
if(this.filterValuesNum == 0){
this.isOpen = true;
this.sortBy = "num";
}else{
this.isOpen = false;
}
this.sub = this.route.queryParams.subscribe(params => { this.sub = this.route.queryParams.subscribe(params => {
this.queryParams = Object.assign({}, params); this.queryParams = Object.assign({}, params);
this.paramPosition = SearchFields.getParameterOrder(this.filter.filterId, this.getEntries(params)); this.paramPosition = SearchFields.getParameterOrder(this.filter.filterId, this.getEntries(params));
}); });
this.filter.values = this.filter.values.filter(value => !value.name.toLowerCase().includes('unknown') && !value.name.toLowerCase().includes('not available')); this.filter.values = this.filter.values.filter(value => !value.name.toLowerCase().includes('unknown') && !value.name.toLowerCase().includes('not available'));
this.sort(this.filter.values);
if (this.filter.filterType == "radio") { if (this.filter.filterType == "radio") {
this.filter.radioValue = ""; this.filter.radioValue = "";
this.filter.values.forEach(value => { this.filter.values.forEach(value => {
@ -238,10 +245,14 @@ export class SearchFilterComponent implements OnInit, OnChanges {
}); });
return sorted; return sorted;
} }
event.stopPropagation();
this.sortedValues = Object.assign(sorted);
} }
toggle() { toggle() {
this.isOpen = !this.isOpen; this.isOpen = !this.isOpen;
event.stopPropagation();
} }
disabled(value) { disabled(value) {

34
sharedComponents/stepper/step.component.ts Normal file
View File

@ -0,0 +1,34 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
@Component({
selector: 'step',
template: `
<div class=" uk-width-auto uk-text-center " style="position: relative; ">
<div style="position: relative; z-index:10; min-width: 140px;" class="">
<div class="uk-margin-small-left stepper-text uk-text-uppercase uk-margin-bottom uk-text-truncate"
[class]="status">{{stepText}}</div>
<div>
<button class="uk-icon-button uk-border-circle" [class]="status" [class.uk-disabled]="status=='disabled'"
(click)="stepChanged.emit(stepId)">
<span *ngIf="status != 'done'">{{stepNumber}}</span>
<span *ngIf="status == 'done'" uk-icon="check"></span>
</button>
</div>
</div>
<step-line *ngIf="showStepLine" [status]="status" [stepNumber]="stepNumber" class="stepper-line-container"
[style.z-index]="(+stepNumber)"></step-line>
</div>
`
})
export class StepComponent {
@Input() status: 'active' | 'default' | 'disabled' | 'done';
@Input() stepId;
@Input() stepNumber;
@Input() stepText;
@Input() active;
@Output() stepChanged: EventEmitter<string> = new EventEmitter<string>();
@Input() showStepLine:boolean = false;
}

17
sharedComponents/stepper/stepLine.component.ts Normal file
View File

@ -0,0 +1,17 @@
import {Component, Input} from '@angular/core';
@Component({
selector: 'step-line',
template: `
<div class="stepper-line uk-margin-bottom uk-width-medium@m uk-width-small@s" [class]="status + ' step' + stepNumber"></div>
`
})
export class StepLineComponent {
@Input() status: 'active' | 'default' | 'disabled' | 'done';
@Input() stepNumber;
}

32
sharedComponents/stepper/stepper.component.ts Normal file
View File

@ -0,0 +1,32 @@
import {Component} from '@angular/core';
/*
* usage example
*
* <stepper>
<step status="active" stepId="step1" stepNumber="1"
stepText="Step 1"
active="step1" [showStepLine]="false"></step>
<step status="disabled" stepId="step2" stepNumber="2"
stepText="Step 2"
active="step1"
[showStepLine]="true"></step>
</stepper>
* */
@Component({
selector: 'stepper',
template: `
<div class="stepper" >
<div class=" uk-flex uk-flex-center " >
<div class=" uk-grid uk-grid-small uk-flex uk-flex-bottom uk-text-small uk-width-auto">
<ng-content></ng-content>
</div>
</div>
</div>
`
})
export class StepperComponent {
}

18
sharedComponents/stepper/stepper.module.ts Normal file
View File

@ -0,0 +1,18 @@
import { NgModule } from '@angular/core';
import {SharedModule} from "../../../shared/shared.module";
import {StepperComponent} from "./stepper.component";
import {StepComponent} from "./step.component";
import {StepLineComponent} from "./stepLine.component";
@NgModule({
imports: [
SharedModule,
],
declarations: [
StepperComponent, StepComponent, StepLineComponent
], exports: [StepperComponent, StepComponent, StepLineComponent ]
})
export class StepperModule { }