[Library | explore-redesign]: resultLanding.component.html: Small fixes on how impact and usage metrics (inside tab) appear in mobile | dataProvider.component.ts: Updated checks in hasMetrics() - do not show metrics until we get the response for views and downloads.

This commit is contained in:
Konstantina Galouni 2023-02-22 02:23:10 +02:00
parent 4aa350ff2b
commit f0f1874039
2 changed files with 7 additions and 5 deletions

View File

@ -685,7 +685,8 @@ export class DataProviderComponent {
} }
public get hasMetrics(): boolean { public get hasMetrics(): boolean {
return !(this.totalViews != null && this.totalDownloads != null) || this.totalViews > 0 || this.totalDownloads > 0; // return !(this.totalViews != null && this.totalDownloads != null) || this.totalViews > 0 || this.totalDownloads > 0;
return (this.totalViews != null && this.totalViews > 0) || (this.totalDownloads != null && this.totalDownloads > 0);
} }
// public openStatistics() { // public openStatistics() {

View File

@ -1117,7 +1117,7 @@
</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.citations || resultLandingInfo.measure.popularity || resultLandingInfo.measure.influence || resultLandingInfo.measure.impulse)">
<div class="uk-flex uk-flex-center uk-flex-middle"> <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>
@ -1190,15 +1190,16 @@
</li> </li>
<!-- usage --> <!-- usage -->
<li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.downloads || resultLandingInfo.measure.views)"> <li *ngIf="resultLandingInfo.measure && (resultLandingInfo.measure.downloads || resultLandingInfo.measure.views)">
<div class="uk-flex uk-flex-center uk-flex-middle"> <div class="uk-flex uk-flex-center uk-flex-middle uk-flex-wrap" [class.uk-flex-column]="isMobile">
<div class="uk-margin-large-right"> <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"> <div *ngIf="resultLandingInfo.measure.downloads" class="uk-text-center uk-margin-medium-bottom">
<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]="resultLandingInfo.measure.downloads >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.downloads | number}}">{{formatNumber(resultLandingInfo.measure.downloads)}}</div> title="{{resultLandingInfo.measure.downloads | number}}">{{formatNumber(resultLandingInfo.measure.downloads)}}</div>
<div class="uk-text-bold">Downloads</div> <div class="uk-text-bold">Downloads</div>
</div> </div>
<div *ngIf="resultLandingInfo.measure.views" class="uk-text-center uk-margin-medium-bottom"> <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" <div class="uk-text-background uk-text-bold number metrics-number"
[attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'" [attr.uk-tooltip]="resultLandingInfo.measure.views >= 1000 ? 'cls: uk-active' : 'cls: uk-invisible'"
title="{{resultLandingInfo.measure.views | number}}">{{formatNumber(resultLandingInfo.measure.views)}}</div> title="{{resultLandingInfo.measure.views | number}}">{{formatNumber(resultLandingInfo.measure.views)}}</div>