resultLanding: use common structure for metrics (measure)

This commit is contained in:
Alex Martzios 2023-05-04 11:58:11 +03:00
parent 8a8a7e4152
commit b500fcb957
2 changed files with 119 additions and 177 deletions

View File

@ -325,7 +325,7 @@
<ng-container *ngTemplateOutlet="enermapsTool_content"></ng-container>
</div>
</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>
</div>
@ -374,49 +374,69 @@
<ng-template #right_column>
<!-- 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">
<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-grid uk-grid-small uk-flex-nowrap" uk-grid uk-height-match="target: > div > .cell">
<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-flex uk-flex-middle"><icon name="visibility" [ratio]="0.8" [flex]="true"></icon></div>
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
<div *ngIf="measure.value" class="cell uk-flex uk-flex-middle uk-margin-xsmall-bottom">
<icon [name]="measure.icon" [ratio]="0.8" [flex]="true"></icon>
</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 *ngIf="resultLandingInfo.measure.citations" class="cell uk-margin-xsmall-bottom">
<a>Citations</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: false}"></ng-container>
</div>
<div *ngIf="resultLandingInfo.measure.popularity" class="cell uk-margin-xsmall-bottom">
<a>Popularity</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'popularity', isCompact: false}"></ng-container>
</div>
<div *ngIf="resultLandingInfo.measure.influence" class="cell uk-margin-xsmall-bottom">
<a>Influence</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'influence', 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>
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
<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>
</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" [class.uk-margin-xsmall-bottom]="i != resultLandingInfo.measure.counts.length - 1">
<a class="uk-text-capitalize">{{measure.name}}</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: false}"></ng-container>
</div>
</ng-container>
</ng-container>
</div>
<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'"
title="{{resultLandingInfo.measure.citations | number}}" class="cell uk-margin-xsmall-bottom">{{formatNumber(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" [attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.downloads | number}}" class="cell uk-margin-xsmall-bottom">{{formatNumber(resultLandingInfo.measure.downloads)}}</div>
<div *ngIf="resultLandingInfo.measure.views" [attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.views | number}}" class="cell">{{formatNumber(resultLandingInfo.measure.views)}}</div>
<ng-container *ngIf="resultLandingInfo.measure.bip.length">
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip">
<ng-container *ngIf="isNumber(measure)">
<div *ngIf="measure.value" [attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{measure.value | number}}" class="cell uk-margin-xsmall-bottom">
{{formatNumber(measure.value)}}
</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>
@ -1009,13 +1029,13 @@
<li class="uk-padding-remove">
<a href="#">Overview</a>
</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>
</li>
<li *ngIf="hasAltMetrics">
<a href="#">Social</a>
</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>
</li>
</ul>
@ -1023,7 +1043,7 @@
<!-- overview -->
<li>
<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>
<div class="uk-text-center uk-margin-small-bottom">
@ -1040,54 +1060,20 @@
<div>
<table class="uk-table uk-table-small">
<tbody>
<tr>
<td class="uk-padding-remove-top">
<icon name="cite" [flex]="true" [customClass]="'bip-icon'"></icon>
</td>
<td class="uk-padding-remove-top">
<a class="uk-link uk-link-text">Citations</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: true}"></ng-container>
</td>
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder">
{{formatNumber(resultLandingInfo.measure.citations)}}
</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>
</tr>
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip; let i = index">
<tr>
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
<icon [name]="measure.icon" [flex]="true" [customClass]="'bip-icon'"></icon>
</td>
<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 uk-text-capitalize">{{measure.name}}</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: true}"></ng-container>
</td>
<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">
{{isNumber(measure.value) ? formatNumber(measure.value) : measure.value}}
</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
@ -1096,7 +1082,7 @@
<div *ngIf="hasAltMetrics">
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="donut"></altmetrics>
</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>
<div class="uk-text-center uk-margin-small-bottom">
@ -1112,32 +1098,21 @@
<div>
<table class="uk-table uk-table-small">
<tbody>
<tr *ngIf="resultLandingInfo.measure.downloads">
<td class="uk-padding-remove-top">
<icon name="download" [flex]="true" [ratio]="1.2" customClass="uk-text-background text-usage-counts"></icon>
</td>
<td class="uk-padding-remove-top">
Downloads
</td>
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder"
[attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.downloads | number}}">
{{formatNumber(resultLandingInfo.measure.downloads)}}
</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>
</tr>
<ng-container *ngFor="let measure of resultLandingInfo.measure.counts; let i = index">
<tr>
<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 class="uk-text-capitalize" [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.counts.length - 1">
{{measure.name}}
</td>
<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]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{measure.value | number}}">
{{formatNumber(measure.value)}}
</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
@ -1146,59 +1121,25 @@
</div>
</li>
<!-- 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-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" [customClass]="'bip-icon'"></icon>
</td>
<td class="uk-padding-remove-top">
<a class="uk-link uk-link-text">Citations</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: 'citations', isCompact: true}"></ng-container>
</td>
<td class="uk-padding-remove-top uk-text-uppercase uk-text-bolder">
{{formatNumber(resultLandingInfo.measure.citations)}}
</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>
</tr>
<ng-container *ngFor="let measure of resultLandingInfo.measure.bip; let i = index">
<tr>
<td [class.uk-padding-remove-top]="i == 0" [class.uk-padding-remove-bottom]="i == resultLandingInfo.measure.bip.length - 1">
<icon [name]="measure.icon" [flex]="true" [customClass]="'bip-icon'"></icon>
</td>
<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 uk-text-capitalize">{{measure.name}}</a>
<ng-container *ngTemplateOutlet="dropInfo; context: {option: measure.name, isCompact: true}"></ng-container>
</td>
<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">
{{isNumber(measure.value) ? formatNumber(measure.value) : measure.value}}
</td>
</tr>
</ng-container>
</tbody>
</table>
</div>
@ -1221,22 +1162,17 @@
<altmetrics id="{{resultLandingInfo.identifiers?.get('doi')[0]}}" type="doi" size="medium-donut"></altmetrics>
</li>
<!-- 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-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">
<div class="uk-text-background uk-text-bold number metrics-number"
[attr.uk-tooltip]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.downloads | number}}">{{formatNumber(resultLandingInfo.measure.downloads)}}</div>
<div class="uk-text-bold">Downloads</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>
<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"
[attr.uk-tooltip]="measure.value >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{measure.value | number}}">{{formatNumber(measure.value)}}</div>
<div class="uk-text-bold uk-text-capitalize">{{measure.name}}</div>
</div>
</ng-container>
</div>
<ng-container *ngIf="viewsFrameUrl || downloadsFrameUrl">
<div *ngIf="metricsClicked && downloadsFrameUrl && resultLandingInfo.measure.downloads" class="uk-margin-large-right">

View File

@ -1084,11 +1084,17 @@ 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>";
} 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>";
} else if (value == 'downloads') {
} 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') {
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') {
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'>Views provided by <a href='https://usagecounts.openaire.eu/' target='_blank' class='uk-link-reset'><strong>UsageCounts</strong></a></div>";
}
}
}
public isNumber(value): boolean {
return typeof value === 'number';
}
}