resultLanding: use common structure for metrics (measure)
This commit is contained in:
parent
8a8a7e4152
commit
b500fcb957
|
@ -325,7 +325,7 @@
|
||||||
<ng-container *ngTemplateOutlet="enermapsTool_content"></ng-container>
|
<ng-container *ngTemplateOutlet="enermapsTool_content"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container *ngIf="resultLandingInfo && (resultLandingInfo.measure || hasAltMetrics)">
|
<ng-container *ngIf="resultLandingInfo && ((resultLandingInfo.measure && (resultLandingInfo.measure.bip.length || resultLandingInfo.measure.counts.length)) || hasAltMetrics)">
|
||||||
<ng-container *ngTemplateOutlet="metricsContent"></ng-container>
|
<ng-container *ngTemplateOutlet="metricsContent"></ng-container>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
@ -374,49 +374,69 @@
|
||||||
|
|
||||||
<ng-template #right_column>
|
<ng-template #right_column>
|
||||||
<!-- new metrics box -->
|
<!-- new metrics box -->
|
||||||
<div *ngIf="resultLandingInfo && resultLandingInfo.measure && !viewAll"
|
<div *ngIf="resultLandingInfo && resultLandingInfo.measure && (resultLandingInfo.measure.bip.length || resultLandingInfo.measure.counts.length) && !viewAll"
|
||||||
class="uk-margin-medium-top uk-padding uk-padding-remove-vertical">
|
class="uk-margin-medium-top uk-padding uk-padding-remove-vertical">
|
||||||
<div class="landing-metrics-card uk-card uk-card-secondary uk-text-small uk-flex uk-padding-small">
|
<div class="landing-metrics-card uk-card uk-card-secondary uk-text-small uk-flex uk-padding-small">
|
||||||
<div class="uk-width-expand uk-flex uk-flex-middle">
|
<div class="uk-width-expand uk-flex uk-flex-middle">
|
||||||
<div class="uk-grid uk-grid-small uk-flex-nowrap" uk-grid uk-height-match="target: > div > .cell">
|
<div class="uk-grid uk-grid-small uk-flex-nowrap" uk-grid uk-height-match="target: > div > .cell">
|
||||||
<div>
|
<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>
|
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
|
||||||
<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>
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
|
||||||
<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="measure.value" class="cell uk-flex uk-flex-middle uk-margin-xsmall-bottom">
|
||||||
<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>
|
<icon [name]="measure.icon" [ratio]="0.8" [flex]="true"></icon>
|
||||||
<div *ngIf="resultLandingInfo.measure.views" class="cell uk-flex uk-flex-middle"><icon name="visibility" [ratio]="0.8" [flex]="true"></icon></div>
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container *ngIf="resultLandingInfo.measure.counts.length">
|
||||||
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
|
||||||
|
<div *ngIf="measure.value" class="cell uk-flex uk-flex-middle" [class.uk-margin-xsmall-bottom]="i != resultLandingInfo.measure.counts.length - 1">
|
||||||
|
<icon [name]="measure.icon" [ratio]="0.8" [flex]="true"></icon>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div *ngIf="resultLandingInfo.measure.citations" class="cell uk-margin-xsmall-bottom">
|
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
|
||||||
<a>Citations</a>
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: false}"></ng-container>
|
<div *ngIf="measure.value" class="cell uk-margin-xsmall-bottom">
|
||||||
|
<a class="uk-text-capitalize">{{measure.name}}</a>
|
||||||
|
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: false}"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom">
|
</ng-container>
|
||||||
<a>Popularity</a>
|
</ng-container>
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'popularity', isCompact: false}"></ng-container>
|
<ng-container *ngIf="resultLandingInfo.measure.counts.length">
|
||||||
</div>
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
|
||||||
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom">
|
<div *ngIf="measure.value" class="cell" [class.uk-margin-xsmall-bottom]="i != resultLandingInfo.measure.counts.length - 1">
|
||||||
<a>Influence</a>
|
<a class="uk-text-capitalize">{{measure.name}}</a>
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'influence', isCompact: false}"></ng-container>
|
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: false}"></ng-container>
|
||||||
</div>
|
|
||||||
<div *ngIf="resultLandingInfo.measure.downloads" class="cell uk-margin-xsmall-bottom">
|
|
||||||
<a>Downloads</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'downloads', isCompact: false}"></ng-container>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="resultLandingInfo.measure.views" class="cell">
|
|
||||||
<a>Views</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'views', isCompact: false}"></ng-container>
|
|
||||||
</div>
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-text-uppercase uk-text-bolder">
|
<div class="uk-text-uppercase uk-text-bolder">
|
||||||
<div *ngIf="resultLandingInfo.measure.citations" [attr.uk-tooltip]="resultLandingInfo.measure.citations >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
|
||||||
title="{{resultLandingInfo.measure.citations | number}}" class="cell uk-margin-xsmall-bottom">{{formatNumber(resultLandingInfo.measure.citations)}}</div>
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
|
||||||
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.popularity}}</div>
|
<ng-container *ngIf="isNumber(measure)">
|
||||||
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom">{{resultLandingInfo.measure.influence}}</div>
|
<div *ngIf="measure.value" [attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
||||||
<div *ngIf="resultLandingInfo.measure.downloads" [attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
title="{{measure.value | number}}" class="cell uk-margin-xsmall-bottom">
|
||||||
title="{{resultLandingInfo.measure.downloads | number}}" class="cell uk-margin-xsmall-bottom">{{formatNumber(resultLandingInfo.measure.downloads)}}</div>
|
{{formatNumber(measure.value)}}
|
||||||
<div *ngIf="resultLandingInfo.measure.views" [attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
</div>
|
||||||
title="{{resultLandingInfo.measure.views | number}}" class="cell">{{formatNumber(resultLandingInfo.measure.views)}}</div>
|
</ng-container>
|
||||||
|
<ng-container *ngIf="!isNumber(measure)">
|
||||||
|
<div *ngIf="measure.value" class="cell uk-margin-xsmall-bottom">
|
||||||
|
{{measure.value}}
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container *ngIf="resultLandingInfo.measure.counts.length">
|
||||||
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
|
||||||
|
<div *ngIf="measure.value" [attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
||||||
|
title="{{measure.value | number}}" class="cell" [class.uk-margin-xsmall-bottom]="i != resultLandingInfo.measure.counts.length - 1">
|
||||||
|
{{formatNumber(measure.value)}}
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1009,13 +1029,13 @@
|
||||||
<li class="uk-padding-remove">
|
<li class="uk-padding-remove">
|
||||||
<a href="#">Overview</a>
|
<a href="#">Overview</a>
|
||||||
</li>
|
</li>
|
||||||
<li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse)">
|
<li *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.bip.length">
|
||||||
<a href="#">Impact</a>
|
<a href="#">Impact</a>
|
||||||
</li>
|
</li>
|
||||||
<li *ngIf="hasAltMetrics">
|
<li *ngIf="hasAltMetrics">
|
||||||
<a href="#">Social</a>
|
<a href="#">Social</a>
|
||||||
</li>
|
</li>
|
||||||
<li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.downloads || resultLandingInfo.measure.views)">
|
<li *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.counts.length">
|
||||||
<a href="#" (click)="clickedUsageMetrics()">Usage</a>
|
<a href="#" (click)="clickedUsageMetrics()">Usage</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
@ -1023,7 +1043,7 @@
|
||||||
<!-- overview -->
|
<!-- overview -->
|
||||||
<li>
|
<li>
|
||||||
<div class="uk-flex uk-flex-wrap landing-metrics-overview">
|
<div class="uk-flex uk-flex-wrap landing-metrics-overview">
|
||||||
<div *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse)">
|
<div *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.bip.length">
|
||||||
<div class="uk-grid-divider" uk-grid>
|
<div class="uk-grid-divider" uk-grid>
|
||||||
<div>
|
<div>
|
||||||
<div class="uk-text-center uk-margin-small-bottom">
|
<div class="uk-text-center uk-margin-small-bottom">
|
||||||
|
@ -1040,54 +1060,20 @@
|
||||||
<div>
|
<div>
|
||||||
<table class="uk-table uk-table-small">
|
<table class="uk-table uk-table-small">
|
||||||
<tbody>
|
<tbody>
|
||||||
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip; let i = index">
|
||||||
<tr>
|
<tr>
|
||||||
<td class="uk-padding-remove-top">
|
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
<icon name="cite" [flex]="true" [customClass]="'bip-icon'"></icon>
|
<icon [name]="measure.icon" [flex]="true" [customClass]="'bip-icon'"></icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top">
|
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
<a class="uk-link uk-link-text">Citations</a>
|
<a class="uk-link uk-link-text uk-text-capitalize">{{measure.name}}</a>
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: true}"></ng-container>
|
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: true}"></ng-container>
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder">
|
<td class="uk-text-uppercase uk-text-bolder" [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
{{formatNumber(resultLandingInfo.measure.citations)}}
|
{{isNumber(measure.value) ? formatNumber(measure.value) : measure.value}}
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<icon name="fire" [flex]="true" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a class="uk-link uk-link-text">Popularity</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'popularity', isCompact: true}"></ng-container>
|
|
||||||
</td>
|
|
||||||
<td class="uk-text-uppercase uk-text-bolder">
|
|
||||||
{{resultLandingInfo.measure.popularity}}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<icon name="landmark" [flex]="true" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a class="uk-link uk-link-text">Influence</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'influence', isCompact: true}"></ng-container>
|
|
||||||
</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" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td class="uk-padding-remove-bottom">
|
|
||||||
<a class="uk-link uk-link-text">Impulse</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'impulse', isCompact: true}"></ng-container>
|
|
||||||
</td>
|
|
||||||
<td class="uk-padding-remove-bottom uk-text-uppercase uk-text-bolder">
|
|
||||||
{{resultLandingInfo.measure.impulse}}
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
</ng-container>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1096,7 +1082,7 @@
|
||||||
<div *ngIf="hasAltMetrics">
|
<div *ngIf="hasAltMetrics">
|
||||||
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="donut"></altmetrics>
|
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="donut"></altmetrics>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.downloads || resultLandingInfo.measure.views)">
|
<div *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.counts.length">
|
||||||
<div class="uk-grid-divider" uk-grid>
|
<div class="uk-grid-divider" uk-grid>
|
||||||
<div>
|
<div>
|
||||||
<div class="uk-text-center uk-margin-small-bottom">
|
<div class="uk-text-center uk-margin-small-bottom">
|
||||||
|
@ -1112,32 +1098,21 @@
|
||||||
<div>
|
<div>
|
||||||
<table class="uk-table uk-table-small">
|
<table class="uk-table uk-table-small">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr *ngIf="resultLandingInfo.measure.downloads">
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
|
||||||
<td class="uk-padding-remove-top">
|
<tr>
|
||||||
<icon name="download" [flex]="true" [ratio]="1.2" customClass="uk-text-background text-usage-counts"></icon>
|
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.counts.length - 1">
|
||||||
|
<icon [name]="measure.icon" [flex]="true" [ratio]="1.2" customClass="uk-text-background text-usage-counts"></icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top">
|
<td class="uk-text-capitalize" [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.counts.length - 1">
|
||||||
Downloads
|
{{measure.name}}
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder"
|
<td class="uk-text-uppercase uk-text-bolder" [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.counts.length - 1"
|
||||||
[attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
[attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
||||||
title="{{resultLandingInfo.measure.downloads | number}}">
|
title="{{measure.value | number}}">
|
||||||
{{formatNumber(resultLandingInfo.measure.downloads)}}
|
{{formatNumber(measure.value)}}
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr *ngIf="resultLandingInfo.measure.views">
|
|
||||||
<td class="uk-padding-remove-bottom">
|
|
||||||
<icon name="visibility" [flex]="true" [ratio]="1.2" customClass="uk-text-background text-usage-counts"></icon>
|
|
||||||
</td>
|
|
||||||
<td class="uk-padding-remove-bottom">
|
|
||||||
Views
|
|
||||||
</td>
|
|
||||||
<td class="uk-padding-remove-bottom uk-text-uppercase uk-text-bolder"
|
|
||||||
[attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
|
||||||
title="{{resultLandingInfo.measure.views | number}}">
|
|
||||||
{{formatNumber(resultLandingInfo.measure.views)}}
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
</ng-container>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1146,59 +1121,25 @@
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
<!-- impact -->
|
<!-- impact -->
|
||||||
<li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse)">
|
<li *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.bip.length">
|
||||||
<div class="uk-flex uk-flex-center uk-flex-middle uk-flex-wrap">
|
<div class="uk-flex uk-flex-center uk-flex-middle uk-flex-wrap">
|
||||||
<div class="uk-card uk-card-default uk-padding-small">
|
<div class="uk-card uk-card-default uk-padding-small">
|
||||||
<table class="uk-table uk-table-small uk-margin-remove">
|
<table class="uk-table uk-table-small uk-margin-remove">
|
||||||
<tbody>
|
<tbody>
|
||||||
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip; let i = index">
|
||||||
<tr>
|
<tr>
|
||||||
<td class="uk-padding-remove-top">
|
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
<icon name="cite" [flex]="true" [customClass]="'bip-icon'"></icon>
|
<icon [name]="measure.icon" [flex]="true" [customClass]="'bip-icon'"></icon>
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top">
|
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
<a class="uk-link uk-link-text">Citations</a>
|
<a class="uk-link uk-link-text uk-text-capitalize">{{measure.name}}</a>
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: true}"></ng-container>
|
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: true}"></ng-container>
|
||||||
</td>
|
</td>
|
||||||
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder">
|
<td class="uk-text-uppercase uk-text-bolder" [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
|
||||||
{{formatNumber(resultLandingInfo.measure.citations)}}
|
{{isNumber(measure.value) ? formatNumber(measure.value) : measure.value}}
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<icon name="fire" [flex]="true" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a class="uk-link uk-link-text">Popularity</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'popularity', isCompact: true}"></ng-container>
|
|
||||||
</td>
|
|
||||||
<td class="uk-text-uppercase uk-text-bolder">
|
|
||||||
{{resultLandingInfo.measure.popularity}}
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>
|
|
||||||
<icon name="landmark" [flex]="true" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a class="uk-link uk-link-text">Influence</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'influence', isCompact: true}"></ng-container>
|
|
||||||
</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" [customClass]="'bip-icon'"></icon>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a class="uk-link uk-link-text">Impulse</a>
|
|
||||||
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'impulse', isCompact: true}"></ng-container>
|
|
||||||
</td>
|
|
||||||
<td class="uk-padding-remove-bottom uk-text-uppercase uk-text-bolder">
|
|
||||||
{{resultLandingInfo.measure.impulse}}
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
</ng-container>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1221,22 +1162,17 @@
|
||||||
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="medium-donut"></altmetrics>
|
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="medium-donut"></altmetrics>
|
||||||
</li>
|
</li>
|
||||||
<!-- usage -->
|
<!-- usage -->
|
||||||
<li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.downloads || resultLandingInfo.measure.views)">
|
<li *ngIf="resultLandingInfo.measure && resultLandingInfo.measure.counts.length">
|
||||||
<div class="uk-flex uk-flex-center uk-flex-middle uk-flex-wrap" [class.uk-flex-column]="isMobile">
|
<div class="uk-flex uk-flex-center uk-flex-middle uk-flex-wrap" [class.uk-flex-column]="isMobile">
|
||||||
<div class="uk-margin-large-right uk-flex uk-flex-center uk-flex-middle uk-flex-wrap" [class.uk-flex-column]="!isMobile">
|
<div class="uk-margin-large-right uk-flex uk-flex-center uk-flex-middle uk-flex-wrap" [class.uk-flex-column]="!isMobile">
|
||||||
<div *ngIf="resultLandingInfo.measure.downloads" class="uk-text-center uk-margin-medium-bottom" [class.uk-margin-medium-right]="isMobile">
|
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
|
||||||
|
<div *ngIf="measure.value" class="uk-text-center uk-margin-medium-bottom" [class.uk-margin-medium-right]="isMobile">
|
||||||
<div class="uk-text-background uk-text-bold number metrics-number"
|
<div class="uk-text-background uk-text-bold number metrics-number"
|
||||||
[attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
[attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
||||||
title="{{resultLandingInfo.measure.downloads | number}}">{{formatNumber(resultLandingInfo.measure.downloads)}}</div>
|
title="{{measure.value | number}}">{{formatNumber(measure.value)}}</div>
|
||||||
<div class="uk-text-bold">Downloads</div>
|
<div class="uk-text-bold uk-text-capitalize">{{measure.name}}</div>
|
||||||
</div>
|
|
||||||
<div *ngIf="resultLandingInfo.measure.views" class="uk-text-center uk-margin-medium-bottom"
|
|
||||||
[class.uk-margin-medium-left]="isMobile && resultLandingInfo.measure.downloads">
|
|
||||||
<div class="uk-text-background uk-text-bold number metrics-number"
|
|
||||||
[attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
|
|
||||||
title="{{resultLandingInfo.measure.views | number}}">{{formatNumber(resultLandingInfo.measure.views)}}</div>
|
|
||||||
<div class="uk-text-bold">Views</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
<ng-container *ngIf="viewsFrameUrl || downloadsFrameUrl">
|
<ng-container *ngIf="viewsFrameUrl || downloadsFrameUrl">
|
||||||
<div *ngIf="metricsClicked && downloadsFrameUrl && resultLandingInfo.measure.downloads" class="uk-margin-large-right">
|
<div *ngIf="metricsClicked && downloadsFrameUrl && resultLandingInfo.measure.downloads" class="uk-margin-large-right">
|
||||||
|
|
|
@ -1084,6 +1084,8 @@ export class ResultLandingComponent {
|
||||||
return "<div>This indicator reflects the \"current\" impact/attention (the \"hype\") of an article in the research community at large, based on the underlying citation network.</div><div class='uk-flex uk-margin-top'><a href='https://bip.imsi.athenarc.gr/' target='_blank'><img class='uk-margin-small-right' src='assets/common-assets/bip-minimal.svg' loading='lazy' alt='BIP!' style='width: 40px;'></a><span class='uk-text-uppercase'>Popularity provided by <a href='https://bip.imsi.athenarc.gr/' target='_blank' class='uk-link-reset'><strong>BIP!</strong></a></div>";
|
return "<div>This indicator reflects the \"current\" impact/attention (the \"hype\") of an article in the research community at large, based on the underlying citation network.</div><div class='uk-flex uk-margin-top'><a href='https://bip.imsi.athenarc.gr/' target='_blank'><img class='uk-margin-small-right' src='assets/common-assets/bip-minimal.svg' loading='lazy' alt='BIP!' style='width: 40px;'></a><span class='uk-text-uppercase'>Popularity provided by <a href='https://bip.imsi.athenarc.gr/' target='_blank' class='uk-link-reset'><strong>BIP!</strong></a></div>";
|
||||||
} else if (value == 'influence') {
|
} else if (value == 'influence') {
|
||||||
return "<div>This indicator reflects the overall/total impact of an article in the research community at large, based on the underlying citation network (diachronically).</div><div class='uk-flex uk-margin-top'><a href='https://bip.imsi.athenarc.gr/' target='_blank'><img class='uk-margin-small-right' src='assets/common-assets/bip-minimal.svg' loading='lazy' alt='BIP!' style='width: 40px;'></a><span class='uk-text-uppercase'>Influence provided by <a href='https://bip.imsi.athenarc.gr/' target='_blank' class='uk-link-reset'><strong>BIP!</strong></a></div>";
|
return "<div>This indicator reflects the overall/total impact of an article in the research community at large, based on the underlying citation network (diachronically).</div><div class='uk-flex uk-margin-top'><a href='https://bip.imsi.athenarc.gr/' target='_blank'><img class='uk-margin-small-right' src='assets/common-assets/bip-minimal.svg' loading='lazy' alt='BIP!' style='width: 40px;'></a><span class='uk-text-uppercase'>Influence provided by <a href='https://bip.imsi.athenarc.gr/' target='_blank' class='uk-link-reset'><strong>BIP!</strong></a></div>";
|
||||||
|
} else if (value == 'impulse') {
|
||||||
|
return "<div>This indicator reflects the initial momentum of an article directly after its publication, based on the underlying citation network.</div><div class='uk-flex uk-margin-top'><a href='https://bip.imsi.athenarc.gr/' target='_blank'><img class='uk-margin-small-right' src='assets/common-assets/bip-minimal.svg' loading='lazy' alt='BIP!' style='width: 40px;'></a><span class='uk-text-uppercase'>Impulse provided by <a href='https://bip.imsi.athenarc.gr/' target='_blank' class='uk-link-reset'><strong>BIP!</strong></a></div>";
|
||||||
} else if (value == 'downloads') {
|
} else if (value == 'downloads') {
|
||||||
return "<div class='uk-flex uk-flex-middle'><a href='https://usagecounts.openaire.eu/' target='_blank'><img src='assets/common-assets/logo-small-usage-counts.png' loading='lazy' alt='OpenAIRE UsageCounts'></a><span class='uk-text-uppercase uk-margin-small-left'>Downloads provided by <a href='https://usagecounts.openaire.eu/' target='_blank' class='uk-link-reset'><strong>UsageCounts</strong></a></div>";
|
return "<div class='uk-flex uk-flex-middle'><a href='https://usagecounts.openaire.eu/' target='_blank'><img src='assets/common-assets/logo-small-usage-counts.png' loading='lazy' alt='OpenAIRE UsageCounts'></a><span class='uk-text-uppercase uk-margin-small-left'>Downloads provided by <a href='https://usagecounts.openaire.eu/' target='_blank' class='uk-link-reset'><strong>UsageCounts</strong></a></div>";
|
||||||
} else if (value == 'views') {
|
} else if (value == 'views') {
|
||||||
|
@ -1091,4 +1093,8 @@ export class ResultLandingComponent {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public isNumber(value): boolean {
|
||||||
|
return typeof value === 'number';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue