progress in result landing page
This commit is contained in:
parent
c1fa0889ee
commit
95de86e767
|
|
@ -1,53 +1,60 @@
|
|||
import {Component, ElementRef, EventEmitter, Input, Output, ViewChild} from '@angular/core';
|
||||
import {HostedByCollectedFrom} from "../../utils/result-preview/result-preview";
|
||||
import {properties} from "../../../../environments/environment";
|
||||
import {StringUtils} from '../../utils/string-utils.class';
|
||||
|
||||
declare var UIkit;
|
||||
@Component({
|
||||
selector: 'availableOn',
|
||||
template: `
|
||||
<ng-container *ngIf="availableOn">
|
||||
<a class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||
<span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'lock_open' ? 'uk-text-success' : 'uk-text-meta')"
|
||||
uk-tooltip [title]="availableOn[0].accessRight ? availableOn[0].accessRight : 'Not available'">
|
||||
<icon [name]="availableOn[0].accessRightIcon" flex="true" type="outlined"></icon>
|
||||
</span>
|
||||
<span>{{availableOn[0].downloadNames.join("; ")}}</span>
|
||||
<icon class="uk-margin-xsmall-left" [flex]="true" [name]="'expand_' + (isOpen?'less':'more')"></icon>
|
||||
</a>
|
||||
|
||||
<div #dropElement uk-drop="mode: click; pos: bottom-left;" class="download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small">
|
||||
<div *ngFor="let instance of availableOn let i=index" class="download-drop-item uk-flex uk-flex-top">
|
||||
<span [class]="'uk-margin-small-right ' + (instance.accessRightIcon == 'lock_open' ? 'uk-text-success' : 'uk-text-meta')"
|
||||
uk-tooltip [title]="instance.accessRight ? instance.accessRight : 'Not available'">
|
||||
<icon [name]="instance.accessRightIcon" flex="true" type="outlined"></icon>
|
||||
<div class="uk-flex uk-flex-middle uk-flex-center">
|
||||
<a *ngIf="availableOn[0].downloadUrl" [href]="availableOn[0].downloadUrl" target="_blank"
|
||||
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder custom-external">
|
||||
<span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'lock_open' ? 'uk-text-success' : 'uk-text-meta')"
|
||||
uk-tooltip [title]="availableOn[0].accessRight ? availableOn[0].accessRight : 'Not available'">
|
||||
<icon [name]="availableOn[0].accessRightIcon" flex="true" type="outlined"></icon>
|
||||
</span>
|
||||
<div class="uk-width-expand uk-padding-small uk-padding-remove-left uk-padding-remove-vertical">
|
||||
<span class="uk-text-emphasis">
|
||||
<a *ngIf="instance.downloadUrl" [href]="instance.downloadUrl" target="_blank"
|
||||
class="title uk-link-text uk-text-bold custom-external uk-display-inline-block">
|
||||
{{instance.downloadNames.join("; ")}}
|
||||
</a>
|
||||
<span>{{sliceString(availableOn[0].downloadNames.join("; "), 20)}}</span>
|
||||
</a>
|
||||
|
||||
<a class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||
<icon [flex]="true" [name]="'expand_' + (isOpen?'less':'more')"></icon>
|
||||
</a>
|
||||
|
||||
<div #dropElement uk-drop="mode: click; pos: bottom-left;" class="download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small">
|
||||
<div *ngFor="let instance of availableOn let i=index" class="download-drop-item uk-flex uk-flex-top">
|
||||
<span [class]="'uk-margin-small-right ' + (instance.accessRightIcon == 'lock_open' ? 'uk-text-success' : 'uk-text-meta')"
|
||||
uk-tooltip [title]="instance.accessRight ? instance.accessRight : 'Not available'">
|
||||
<icon [name]="instance.accessRightIcon" flex="true" type="outlined"></icon>
|
||||
</span>
|
||||
<div *ngIf="instance.types?.length > 0 || instance.years?.length > 0" class="uk-text-meta">
|
||||
<span *ngIf="instance.types?.length > 0" class="uk-text-capitalize">{{instance.types.join(" . ")}}</span>
|
||||
<span *ngIf="instance.types?.length > 0 && instance.years?.length > 0"> . </span>
|
||||
<span *ngIf="instance.years?.length > 0">{{instance.years.join(" . ")}}</span>
|
||||
</div>
|
||||
<div *ngIf="instance.license" class="uk-text-meta uk-text-truncate" uk-tooltip [title]="instance.license">
|
||||
License:
|
||||
<a *ngIf="isUrl(instance.license); else elseBlock"
|
||||
[href]="instance.license" target="_blank" class="custom-external uk-link-text">
|
||||
{{instance.license}}
|
||||
</a>
|
||||
<ng-template #elseBlock> {{instance.license}}</ng-template>
|
||||
</div>
|
||||
<div *ngIf="instance.collectedNamesAndIds?.size > 0" class="uk-text-meta">
|
||||
<span>Providers: </span>
|
||||
<a *ngFor="let collectedName of getKeys(instance.collectedNamesAndIds); let i=index" [routerLink]="dataProviderUrl"
|
||||
[queryParams]="{datasourceId: instance.collectedNamesAndIds.get(collectedName)}" class="uk-link-text">
|
||||
{{collectedName}}<ng-container *ngIf="(i !== (instance.collectedNamesAndIds.size - 1))">; </ng-container>
|
||||
</a>
|
||||
<div class="uk-width-expand uk-padding-small uk-padding-remove-left uk-padding-remove-vertical">
|
||||
<span class="uk-text-emphasis">
|
||||
<a *ngIf="instance.downloadUrl" [href]="instance.downloadUrl" target="_blank"
|
||||
class="title uk-link-text uk-text-bold custom-external uk-display-inline-block">
|
||||
{{instance.downloadNames.join("; ")}}
|
||||
</a>
|
||||
</span>
|
||||
<div *ngIf="instance.types?.length > 0 || instance.years?.length > 0" class="uk-text-meta">
|
||||
<span *ngIf="instance.types?.length > 0" class="uk-text-capitalize">{{instance.types.join(" . ")}}</span>
|
||||
<span *ngIf="instance.types?.length > 0 && instance.years?.length > 0"> . </span>
|
||||
<span *ngIf="instance.years?.length > 0">{{instance.years.join(" . ")}}</span>
|
||||
</div>
|
||||
<div *ngIf="instance.license" class="uk-text-meta uk-text-truncate" uk-tooltip [title]="instance.license">
|
||||
License:
|
||||
<a *ngIf="isUrl(instance.license); else elseBlock"
|
||||
[href]="instance.license" target="_blank" class="custom-external uk-link-text">
|
||||
{{instance.license}}
|
||||
</a>
|
||||
<ng-template #elseBlock> {{instance.license}}</ng-template>
|
||||
</div>
|
||||
<div *ngIf="instance.collectedNamesAndIds?.size > 0" class="uk-text-meta">
|
||||
<span>Providers: </span>
|
||||
<a *ngFor="let collectedName of getKeys(instance.collectedNamesAndIds); let i=index" [routerLink]="dataProviderUrl"
|
||||
[queryParams]="{datasourceId: instance.collectedNamesAndIds.get(collectedName)}" class="uk-link-text">
|
||||
{{collectedName}}<ng-container *ngIf="(i !== (instance.collectedNamesAndIds.size - 1))">; </ng-container>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -179,4 +186,8 @@ export class AvailableOnComponent {
|
|||
get isOpen() {
|
||||
return (typeof document !== 'undefined') && this.dropElement && UIkit.drop(this.dropElement.nativeElement).isActive();
|
||||
}
|
||||
|
||||
public sliceString(str: string, size: number) {
|
||||
return StringUtils.sliceString(str, size)
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,11 +12,11 @@ import {StringUtils} from "../../utils/string-utils.class";
|
|||
<icon class="uk-margin-small-right" name="arrow_back" flex="true" ratio="1.2"></icon>
|
||||
<span class="uk-text-nowrap">{{title}}</span>
|
||||
</span>
|
||||
<span *ngIf="!viewAll" class="uk-text-light-grey uk-text-nowrap uk-margin-small-right">{{title}}</span>
|
||||
<span *ngIf="!viewAll" class="uk-text-emphasis uk-text-bolder uk-text-nowrap uk-margin-small-right">{{title}}</span>
|
||||
<!-- <a *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;">View less</a>-->
|
||||
<a *ngIf="subjects && subjects.length > threshold && !viewAll"
|
||||
(click)="viewAllClick();" class="view-more-less-link uk-text-truncate" uk-tooltip="View all & feedback">
|
||||
<span class="">View all & feedback</span>
|
||||
<span class="">View all & suggest</span>
|
||||
</a>
|
||||
<a *ngIf="(subjects && subjects.length <= threshold || viewAll)" class="uk-link uk-text-truncate"
|
||||
(click)="feedbackClick();">Feedback</a>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import {HelperFunctions} from '../../utils/HelperFunctions.class';
|
|||
<icon class="uk-margin-small-right" name="arrow_back" flex="true" ratio="1.2"></icon>
|
||||
{{title}}
|
||||
</span>
|
||||
<span *ngIf="!viewAll || lessBtn" class="uk-text-light-grey">{{title}}</span>
|
||||
<span *ngIf="!viewAll || lessBtn" class="uk-text-emphasis uk-text-bolder">{{title}}</span>
|
||||
<a *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;" class="view-more-less-link">View less</a>
|
||||
<a *ngIf="fundedByProjects && fundedByProjects.length > threshold && !viewAll"
|
||||
(click)="viewAllClick();" class="view-more-less-link">View all</a>
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
|
|||
<icon class="uk-margin-small-right" name="arrow_back" flex="true" ratio="1.2"></icon>
|
||||
{{title}}
|
||||
</span>
|
||||
<span *ngIf="!viewAll || lessBtn" class="uk-text-light-grey">{{title}}</span>
|
||||
<span *ngIf="!viewAll || lessBtn" class="uk-text-emphasis uk-text-bolder">{{title}}</span>
|
||||
<a *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;" class="view-more-less-link">View less</a>
|
||||
<a *ngIf="communities && communities.length > threshold && !viewAll"
|
||||
(click)="viewAllClick();" class="view-more-less-link">View all</a>
|
||||
|
|
|
|||
|
|
@ -13,11 +13,11 @@ import {StringUtils} from "../../utils/string-utils.class";
|
|||
<icon class="uk-margin-small-right" name="arrow_back" flex="true" ratio="1.2"></icon>
|
||||
<span uk-tooltip="Sustainable Development Goals">{{title}}</span>
|
||||
</span>
|
||||
<span *ngIf="!viewAll" class="uk-text-light-grey uk-text-nowrap uk-margin-small-right" uk-tooltip="Sustainable Development Goals">{{title}}</span>
|
||||
<span *ngIf="!viewAll" class="uk-text-emphasis uk-text-bolder uk-text-nowrap uk-margin-small-right" uk-tooltip="Sustainable Development Goals">{{title}}</span>
|
||||
<!-- <a *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;">View less</a>-->
|
||||
<a *ngIf="subjects && subjects.length > threshold && !viewAll"
|
||||
(click)="viewAllClick();" class="view-more-less-link uk-text-truncate" uk-tooltip="View all & feedback">
|
||||
View all & feedback</a>
|
||||
View all & suggest</a>
|
||||
<a *ngIf="(subjects && subjects.length <= threshold || viewAll)" class="uk-link uk-text-truncate"
|
||||
(click)="feedbackClick();">Feedback</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -108,9 +108,9 @@
|
|||
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
||||
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
||||
<!-- Download from -->
|
||||
<availableOn [availableOn]="resultLandingInfo.hostedBy_collectedFrom" (viewAllClicked)="viewAll=$event"></availableOn>
|
||||
<availableOn *ngIf="resultLandingInfo?.hostedBy_collectedFrom" [availableOn]="resultLandingInfo.hostedBy_collectedFrom" (viewAllClicked)="viewAll=$event"></availableOn>
|
||||
<!-- Versions -->
|
||||
<a *ngIf="resultLandingInfo.deletedByInferenceIds" (click)="openDeletedByInference()"
|
||||
<a *ngIf="resultLandingInfo?.deletedByInferenceIds" (click)="openDeletedByInference()"
|
||||
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||
<icon flex="true" ratio="0.8" name="versions" visuallyHidden="versions"></icon>
|
||||
<span class="uk-margin-xsmall-left">
|
||||
|
|
@ -118,7 +118,7 @@
|
|||
</span>
|
||||
</a>
|
||||
<!-- Divider -->
|
||||
<span *ngIf="resultLandingInfo.hostedBy_collectedFrom || resultLandingInfo.deletedByInferenceIds" class="landing-action-bar-divider"></span>
|
||||
<span *ngIf="resultLandingInfo?.hostedBy_collectedFrom || resultLandingInfo?.deletedByInferenceIds" class="landing-action-bar-divider"></span>
|
||||
<!-- Actions -->
|
||||
<a *ngIf="isRouteAvailable('participate/direct-claim')"
|
||||
[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
|
||||
|
|
@ -138,16 +138,15 @@
|
|||
<span class="uk-margin-xsmall-left">Cite</span>
|
||||
</a>
|
||||
<ng-container *ngIf="properties.adminToolsPortalType == 'explore' || properties.adminToolsPortalType == 'community' || properties.adminToolsPortalType == 'aggregator'" >
|
||||
<orcid-work [resultId]="id" [resultTitle]="resultLandingInfo.title" [resultLandingInfo]="resultLandingInfo"
|
||||
<orcid-work [resultId]="id" [resultTitle]="resultLandingInfo?.title" [resultLandingInfo]="resultLandingInfo"
|
||||
[pids]="pidsArrayString" [pageType]="'landing'">
|
||||
</orcid-work>
|
||||
</ng-container>
|
||||
<!-- TODO: EGI transfer data action -->
|
||||
<a *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
|
||||
<ng-container *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
|
||||
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi') &&
|
||||
resultLandingInfo.identifiers.get('doi').join('').indexOf('zenodo.')!=-1">
|
||||
<egi-transfer-data [dois]="resultLandingInfo.identifiers.get('doi')" [isOpen]="egiTransferModalOpen"></egi-transfer-data>
|
||||
</a>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -294,7 +293,7 @@
|
|||
customClass="portalTab">
|
||||
</my-tab>
|
||||
<!-- New metrics tab -->
|
||||
<my-tab *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)"
|
||||
<my-tab *ngIf="resultLandingInfo && resultLandingInfo.measure"
|
||||
[tabTitle]="'Metrics'" [tabId]="'metrics'">
|
||||
</my-tab>
|
||||
</my-tabs>
|
||||
|
|
@ -453,26 +452,27 @@
|
|||
</ul>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)">
|
||||
<ng-container *ngIf="resultLandingInfo && resultLandingInfo.measure">
|
||||
<div id="metrics" class="landing-section uk-padding uk-padding-remove-horizontal">
|
||||
<ul class="uk-subnav uk-subnav-pill-alt uk-margin-large-bottom" uk-switcher>
|
||||
<ul class="uk-subnav uk-subnav-pill-alt uk-margin-remove" uk-switcher>
|
||||
<li>
|
||||
<a href="#">Overview</a>
|
||||
</li>
|
||||
<li>
|
||||
<li *ngIf="resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse">
|
||||
<a href="#">Impact</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Social</a>
|
||||
</li>
|
||||
<li>
|
||||
<li *ngIf="resultLandingInfo.measure.downloads || resultLandingInfo.measure.views">
|
||||
<a href="#">Usage</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="uk-switcher">
|
||||
<ul class="uk-switcher uk-margin-large-top">
|
||||
<!-- overview -->
|
||||
<li>
|
||||
<div class="uk-flex uk-flex-wrap">
|
||||
<div id="bip">
|
||||
<div class="uk-flex uk-flex-wrap landing-metrics-overview">
|
||||
<div id="bip" *ngIf="resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse">
|
||||
<div class="uk-grid-divider" uk-grid>
|
||||
<div>
|
||||
<div class="uk-text-center uk-margin-small-bottom">
|
||||
|
|
@ -485,6 +485,9 @@
|
|||
<table class="uk-table uk-table-small">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="uk-padding-remove-top">
|
||||
<icon name="cite" [flex]="true"></icon>
|
||||
</td>
|
||||
<td class="uk-padding-remove-top">
|
||||
Citations
|
||||
</td>
|
||||
|
|
@ -493,6 +496,9 @@
|
|||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<icon name="fire" [flex]="true"></icon>
|
||||
</td>
|
||||
<td>
|
||||
Popularity
|
||||
</td>
|
||||
|
|
@ -501,6 +507,9 @@
|
|||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<icon name="landmark" [flex]="true"></icon>
|
||||
</td>
|
||||
<td>
|
||||
Influence
|
||||
</td>
|
||||
|
|
@ -509,6 +518,9 @@
|
|||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="uk-padding-remove-bottom">
|
||||
<icon name="rocket" [flex]="true"></icon>
|
||||
</td>
|
||||
<td class="uk-padding-remove-bottom">
|
||||
Impulse
|
||||
</td>
|
||||
|
|
@ -522,7 +534,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div id="altmetrics">
|
||||
<div class="uk-grid-divider uk-margin-medium-left" uk-grid>
|
||||
<div class="uk-grid-divider" uk-grid>
|
||||
<div>
|
||||
<div class="uk-text-center uk-margin-small-bottom">
|
||||
<img src="assets/common-assets/" loading="lazy" alt="Altmetric">
|
||||
|
|
@ -554,11 +566,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="usagecounts">
|
||||
<div class="uk-grid-divider uk-margin-medium-left" uk-grid>
|
||||
<div id="usagecounts" *ngIf="resultLandingInfo.measure.downloads || resultLandingInfo.measure.views">
|
||||
<div class="uk-grid-divider" uk-grid>
|
||||
<div>
|
||||
<div class="uk-text-center uk-margin-small-bottom">
|
||||
<img src="assets/common-assets/logo-small-usage-counts.png" loading="lazy" alt="usage counts">
|
||||
<img src="assets/common-assets/logo-small-usage-counts.png" loading="lazy" alt="OpenAIRE UsageCounts">
|
||||
</div>
|
||||
<span class="uk-text-uppercase uk-text-xsmall">Usage by</span>
|
||||
<span class="uk-display-block uk-text-bolder">UsageCounts</span>
|
||||
|
|
@ -595,14 +607,87 @@
|
|||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
2
|
||||
<!-- impact -->
|
||||
<li *ngIf="resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse">
|
||||
<div class="uk-flex uk-flex-center uk-flex-middle">
|
||||
<div class="uk-card uk-card-default uk-padding-small">
|
||||
<table class="uk-table uk-table-small uk-margin-remove">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="uk-padding-remove-top">
|
||||
<icon name="cite" [flex]="true"></icon>
|
||||
</td>
|
||||
<td class="uk-padding-remove-top">
|
||||
Citations
|
||||
</td>
|
||||
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder">
|
||||
{{resultLandingInfo.measure.citations}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<icon name="fire" [flex]="true"></icon>
|
||||
</td>
|
||||
<td>
|
||||
Popularity
|
||||
</td>
|
||||
<td class="uk-text-uppercase uk-text-bolder">
|
||||
{{resultLandingInfo.measure.popularity}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<icon name="landmark" [flex]="true"></icon>
|
||||
</td>
|
||||
<td>
|
||||
Influence
|
||||
</td>
|
||||
<td class="uk-text-uppercase uk-text-bolder">
|
||||
{{resultLandingInfo.measure.influence}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="uk-padding-remove-bottom">
|
||||
<icon name="rocket" [flex]="true"></icon>
|
||||
</td>
|
||||
<td class="uk-padding-remove-bottom">
|
||||
Impulse
|
||||
</td>
|
||||
<td class="uk-padding-remove-bottom uk-text-uppercase uk-text-bolder">
|
||||
{{resultLandingInfo.measure.impulse}}
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="uk-margin-large-left">
|
||||
Chart
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<span class="uk-text-meta">Powered by</span>
|
||||
<img class="uk-margin-small-left uk-margin-small-right" src="assets/common-assets/logo-bip.png" loading="lazy" alt="BIP!">
|
||||
<span class="uk-text-bolder">BIP!</span>
|
||||
</div>
|
||||
</li>
|
||||
<!-- social -->
|
||||
<li>
|
||||
3
|
||||
</li>
|
||||
<li>
|
||||
4
|
||||
<!-- usage -->
|
||||
<li *ngIf="resultLandingInfo.measure.downloads || resultLandingInfo.measure.views">
|
||||
<div class="uk-flex uk-flex-center uk-flex-middle">
|
||||
<div>
|
||||
Stats
|
||||
</div>
|
||||
<div class="uk-margin-large-left">
|
||||
Chart
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-medium-top">
|
||||
<span class="uk-text-meta">Powered by</span>
|
||||
<img class="uk-margin-small-left uk-margin-small-right uk-width-small" src="assets/common-assets/logo-large-usage-counts.png" loading="lazy" alt="OpenAIRE UsageCounts">
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -652,40 +737,36 @@
|
|||
|
||||
<ng-template #right_column>
|
||||
<!-- new metrics box -->
|
||||
<div *ngIf="resultLandingInfo && hasMetrics"
|
||||
<div *ngIf="resultLandingInfo && resultLandingInfo.measure"
|
||||
class="uk-margin-medium-top uk-padding uk-padding-remove-vertical">
|
||||
<div class="uk-card uk-card-secondary uk-flex uk-padding-small">
|
||||
<div class="uk-card uk-card-secondary uk-flex uk-padding-small metrics-background">
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-grid uk-grid-small" uk-grid>
|
||||
<!-- <div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div>
|
||||
<icon name="download" [flex]="true"></icon>
|
||||
</div>
|
||||
<div>
|
||||
<icon name="visibility" [flex]="true"></icon>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="uk-grid uk-grid-small" uk-grid uk-height-match="target: > div > .cell">
|
||||
<div>
|
||||
<div class="uk-margin-xsmall-bottom">Citations</div>
|
||||
<div class="uk-margin-xsmall-bottom">Popularity</div>
|
||||
<div class="uk-margin-xsmall-bottom">Influence</div>
|
||||
<div class="uk-margin-xsmall-bottom">Downloads</div>
|
||||
<div class="uk-margin-xsmall-bottom">Views</div>
|
||||
<div *ngIf="resultLandingInfo.measure.citations" class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="cite" ratio="0.8" [flex]="true"></icon></div>
|
||||
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="fire" ratio="0.8" [flex]="true"></icon></div>
|
||||
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="landmark" ratio="0.8" [flex]="true"></icon></div>
|
||||
<div *ngIf="resultLandingInfo.measure.downloads" class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="download" ratio="0.8" [flex]="true"></icon></div>
|
||||
<div *ngIf="resultLandingInfo.measure.views" class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="visibility" ratio="0.8" [flex]="true"></icon></div>
|
||||
</div>
|
||||
<div>
|
||||
<div *ngIf="resultLandingInfo.measure.citations" class="cell uk-margin-xsmall-bottom">Citations</div>
|
||||
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom">Popularity</div>
|
||||
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom">Influence</div>
|
||||
<div *ngIf="resultLandingInfo.measure.downloads" class="cell uk-margin-xsmall-bottom">Downloads</div>
|
||||
<div *ngIf="resultLandingInfo.measure.views" class="cell uk-margin-xsmall-bottom">Views</div>
|
||||
</div>
|
||||
<div class="uk-text-uppercase uk-text-bolder">
|
||||
<div class="uk-margin-xsmall-bottom">{{resultLandingInfo.measure.citations}}</div>
|
||||
<div class="uk-margin-xsmall-bottom">{{resultLandingInfo.measure.popularity}}</div>
|
||||
<div class="uk-margin-xsmall-bottom">{{resultLandingInfo.measure.influence}}</div>
|
||||
<div class="uk-margin-xsmall-bottom">{{resultLandingInfo.measure.downloads}}</div>
|
||||
<div class="uk-margin-xsmall-bottom">{{resultLandingInfo.measure.views}}</div>
|
||||
<div *ngIf="resultLandingInfo.measure.citations" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.citations}}</div>
|
||||
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.popularity}}</div>
|
||||
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.influence}}</div>
|
||||
<div *ngIf="resultLandingInfo.measure.downloads" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.downloads}}</div>
|
||||
<div *ngIf="resultLandingInfo.measure.views" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.views}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-5">
|
||||
|
||||
<div class="uk-width-1-5 uk-flex uk-flex-bottom">
|
||||
<img src="assets/common-assets/metrics-badge.svg" loading="lazy" alt="Metrics badge">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -721,7 +802,7 @@
|
|||
<!-- Communities -->
|
||||
<div *ngIf="resultLandingInfo.contexts && resultLandingInfo.contexts.length > 0 && !noCommunities && (!viewAll || viewAll=='relatedTo')">
|
||||
<relatedTo [contexts]="resultLandingInfo.contexts" [viewAll]="viewAll=='relatedTo'"
|
||||
(viewAllClicked)="viewAll=$event" (noCommunities)="noCommunities = true"></relatedTo>
|
||||
(viewAllClicked)="viewAll=$event" (noCommunities)="noCommunities = true"></relatedTo>
|
||||
</div>
|
||||
<!-- Download From -->
|
||||
<!-- <div *ngIf="resultLandingInfo.hostedBy_collectedFrom && resultLandingInfo.hostedBy_collectedFrom.length > 0 && (!viewAll || viewAll=='availableOn')">
|
||||
|
|
|
|||
|
|
@ -557,8 +557,10 @@ export class ResultLandingComponent {
|
|||
(this.resultLandingInfo.fundedByProjects && this.resultLandingInfo.fundedByProjects.length > 0)
|
||||
||
|
||||
(this.resultLandingInfo.contexts && this.resultLandingInfo.contexts.length > 0 && !this.noCommunities)
|
||||
||
|
||||
(this.resultLandingInfo.hostedBy_collectedFrom && this.resultLandingInfo.hostedBy_collectedFrom.length > 0);
|
||||
||
|
||||
(this.resultLandingInfo.measure && Object.keys(this.resultLandingInfo.measure).length > 0);
|
||||
// ||
|
||||
// (this.resultLandingInfo.hostedBy_collectedFrom && this.resultLandingInfo.hostedBy_collectedFrom.length > 0);
|
||||
}
|
||||
|
||||
public get metricsCalculated(): boolean {
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ import {MatFormFieldModule} from "@angular/material/form-field";
|
|||
import {MatSelectModule} from "@angular/material/select";
|
||||
import {IconsModule} from "../../utils/icons/icons.module";
|
||||
import {IconsService} from "../../utils/icons/icons.service";
|
||||
import {graph, link, quotes, cite, link_to, versions} from "../../utils/icons/icons";
|
||||
import {graph, link, quotes, cite, link_to, versions, rocket, fire, landmark} from "../../utils/icons/icons";
|
||||
import {InputModule} from "../../sharedComponents/input/input.module";
|
||||
import {EGIDataTransferModule} from "../../utils/dataTransfer/transferData.module";
|
||||
|
||||
|
|
@ -58,6 +58,6 @@ import {EGIDataTransferModule} from "../../utils/dataTransfer/transferData.modul
|
|||
})
|
||||
export class ResultLandingModule {
|
||||
constructor(private iconsService: IconsService) {
|
||||
this.iconsService.registerIcons([link, graph, quotes, cite, link_to, versions])
|
||||
this.iconsService.registerIcons([link, graph, quotes, cite, link_to, versions, rocket, fire, landmark])
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
<a (click)="open()"
|
||||
[title]="'Send data to cloud storage [demo]'"
|
||||
[attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'"
|
||||
> <span icon="cloud-upload"></span>
|
||||
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
|
||||
<span uk-icon="cloud-upload"></span>
|
||||
</span>
|
||||
</a>
|
||||
<a (click)="open()"
|
||||
[title]="'Send data to cloud storage [demo]'"
|
||||
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'"
|
||||
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
|
||||
<icon flex="true" ratio="0.8" name="cloud_upload" visuallyHidden="upload"></icon>
|
||||
<span class="uk-margin-xsmall-left">Transfer</span>
|
||||
</a>
|
||||
|
||||
|
||||
<!-- This is the modal -->
|
||||
|
|
|
|||
|
|
@ -4,18 +4,18 @@ import {FormsModule} from '@angular/forms';
|
|||
import {EGIDataTransferComponent} from "./transferData.component";
|
||||
import {InputModule} from "../../sharedComponents/input/input.module";
|
||||
import {AlertModalModule} from "../modal/alertModal.module";
|
||||
import {IconsModule} from '../icons/icons.module';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule, FormsModule, InputModule, AlertModalModule
|
||||
|
||||
CommonModule, FormsModule, InputModule, AlertModalModule, IconsModule
|
||||
],
|
||||
declarations: [
|
||||
EGIDataTransferComponent
|
||||
],
|
||||
],
|
||||
|
||||
exports: [
|
||||
EGIDataTransferComponent
|
||||
]
|
||||
]
|
||||
})
|
||||
export class EGIDataTransferModule { }
|
||||
|
|
|
|||
|
|
@ -127,4 +127,19 @@ export const versions = {
|
|||
name: 'versions',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" width="17" height="12.143" viewBox="0 0 17 12.143"> <path id="Icon_metro-versions" data-name="Icon metro-versions" d="M4.5,17.426H6.927V16.212H5.713V11.355H6.927V10.141H4.5v7.286Zm7.286-9.714V19.855H21.5V7.712H11.784Zm7.286,9.714H14.213V10.141H19.07ZM8.142,18.641H10.57V17.426H9.356V10.141H10.57V8.926H8.142Z" transform="translate(-4.499 -7.712)" fill="#211f7e"/> </svg>'
|
||||
}
|
||||
|
||||
export const rocket = {
|
||||
name: 'rocket',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M156.6 384.9L125.7 354c-8.5-8.5-11.5-20.8-7.7-32.2c3-8.9 7-20.5 11.8-33.8L24 288c-8.6 0-16.6-4.6-20.9-12.1s-4.2-16.7 .2-24.1l52.5-88.5c13-21.9 36.5-35.3 61.9-35.3l82.3 0c2.4-4 4.8-7.7 7.2-11.3C289.1-4.1 411.1-8.1 483.9 5.3c11.6 2.1 20.6 11.2 22.8 22.8c13.4 72.9 9.3 194.8-111.4 276.7c-3.5 2.4-7.3 4.8-11.3 7.2v82.3c0 25.4-13.4 49-35.3 61.9l-88.5 52.5c-7.4 4.4-16.6 4.5-24.1 .2s-12.1-12.2-12.1-20.9V380.8c-14.1 4.9-26.4 8.9-35.7 11.9c-11.2 3.6-23.4 .5-31.8-7.8zM384 168c22.1 0 40-17.9 40-40s-17.9-40-40-40s-40 17.9-40 40s17.9 40 40 40z"/></svg>'
|
||||
}
|
||||
|
||||
export const fire = {
|
||||
name: 'fire',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M159.3 5.4c7.8-7.3 19.9-7.2 27.7 .1c27.6 25.9 53.5 53.8 77.7 84c11-14.4 23.5-30.1 37-42.9c7.9-7.4 20.1-7.4 28 .1c34.6 33 63.9 76.6 84.5 118c20.3 40.8 33.8 82.5 33.8 111.9C448 404.2 348.2 512 224 512C98.4 512 0 404.1 0 276.5c0-38.4 17.8-85.3 45.4-131.7C73.3 97.7 112.7 48.6 159.3 5.4zM225.7 416c25.3 0 47.7-7 68.8-21c42.1-29.4 53.4-88.2 28.1-134.4c-2.8-5.6-5.6-11.2-9.8-16.8l-50.6 58.8s-81.4-103.6-87.1-110.6C133.1 243.8 112 273.2 112 306.8C112 375.4 162.6 416 225.7 416z"/></svg>'
|
||||
}
|
||||
|
||||
export const landmark = {
|
||||
name: 'landmark',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M240.1 4.2c9.8-5.6 21.9-5.6 31.8 0l171.8 98.1L448 104l0 .9 47.9 27.4c12.6 7.2 18.8 22 15.1 36s-16.4 23.8-30.9 23.8H32c-14.5 0-27.2-9.8-30.9-23.8s2.5-28.8 15.1-36L64 104.9V104l4.4-1.6L240.1 4.2zM64 224h64V416h40V224h64V416h48V224h64V416h40V224h64V420.3c.6 .3 1.2 .7 1.8 1.1l48 32c11.7 7.8 17 22.4 12.9 35.9S494.1 512 480 512H32c-14.1 0-26.5-9.2-30.6-22.7s1.1-28.1 12.9-35.9l48-32c.6-.4 1.2-.7 1.8-1.1V224z"/></svg>'
|
||||
}
|
||||
/** Add new icon under this line to be sure that it will be added on preview */
|
||||
|
|
|
|||
Loading…
Reference in New Issue