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

[develop | DONE | FIXED]: availableOn.component.ts: Added field "@Input() inModal: boolean = false;" and display download sources when in modal - e.g. versions. | result-preview.component.html: Display download sources (<availableOn>) in versions (isDeletedByInferenceModal).

This commit is contained in:
Konstantina Galouni 2024-02-07 21:12:43 +02:00
parent 92f43c280e
commit 09960fda9e
2 changed files with 117 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
landingPages/landing-utils/availableOn.component.ts
View File

@ -14,18 +14,26 @@ import {RouterHelper} from "../../utils/routerHelper.class";
<div class="uk-flex uk-flex-middle" <div class="uk-flex uk-flex-middle"
[ngClass]="isMobile ? ('uk-flex-column ' + (!(usedBy == 'landing') ? 'uk-margin-left uk-margin-xsmall-bottom' : '')) : 'uk-grid uk-grid-small uk-child-width-auto'" [ngClass]="isMobile ? ('uk-flex-column ' + (!(usedBy == 'landing') ? 'uk-margin-left uk-margin-xsmall-bottom' : '')) : 'uk-grid uk-grid-small uk-child-width-auto'"
[attr.uk-grid]="!isMobile ? '' : null"> [attr.uk-grid]="!isMobile ? '' : null">
<ng-container *ngIf="inModal">
<div class="uk-text-small uk-height-max-small uk-overflow-auto">
<ng-container *ngTemplateOutlet="availableOnList"></ng-container>
</div>
</ng-container>
<ng-container *ngIf="!inModal">
<div *ngIf="properties.environment != 'production' && availableOn[0].fulltext" class="uk-flex uk-flex-middle" <div *ngIf="properties.environment != 'production' && availableOn[0].fulltext" class="uk-flex uk-flex-middle"
[ngClass]="isMobile ? 'uk-width-1-1' : 'uk-text-bolder'"> [ngClass]="isMobile ? 'uk-width-1-1' : 'uk-text-bolder'">
<a [href]="availableOn[0].fulltext" target="_blank" <a [href]="availableOn[0].fulltext" target="_blank"
class="uk-flex uk-flex-middle uk-button-link" class="uk-flex uk-flex-middle uk-button-link"
[ngClass]="isMobile ? ((usedBy == 'landing') ? 'uk-width-1-1 uk-padding-small uk-padding-remove-horizontal' : '') : 'uk-flex-center'"> [ngClass]="isMobile ? ((usedBy == 'landing') ? 'uk-width-1-1 uk-padding-small uk-padding-remove-horizontal' : '') : 'uk-flex-center'">
<!-- <icon [flex]="true" [ratio]="0.7" name="download" visuallyHidden="download"></icon>--> <!-- <icon [flex]="true" [ratio]="0.7" name="download" visuallyHidden="download"></icon>-->
<icon name="download" visuallyHidden="donwload" [flex]="true" [ratio]="(isMobile && usedBy == 'landing') ? 1 : 0.8"></icon> <icon name="download" visuallyHidden="donwload" [flex]="true" [ratio]="(isMobile && usedBy == 'landing') ? 1 : 0.8"></icon>
<span class="uk-margin-xsmall-left">Full-Text</span> <span class="uk-margin-xsmall-left">Full-Text</span>
</a> </a>
</div> </div>
<div *ngIf="properties.environment != 'production' && isMobile && (usedBy == 'landing') && availableOn[0].fulltext" class="uk-width-1-1"><hr></div>
<div *ngIf="availableOn[0].downloadUrl" [ngClass]="isMobile ? 'uk-width-1-1' : ''"> <div *ngIf="properties.environment != 'production' && isMobile && (usedBy == 'landing') && availableOn[0].fulltext" class="uk-width-1-1"><hr></div><div *ngIf="availableOn[0].downloadUrl" [ngClass]="isMobile ? 'uk-width-1-1' : ''">
<div class="uk-flex uk-flex-middle" [ngClass]="isMobile ? ((usedBy == 'landing') ? 'uk-padding-small uk-padding-remove-horizontal' : '') : ''"> <div class="uk-flex uk-flex-middle" [ngClass]="isMobile ? ((usedBy == 'landing') ? 'uk-padding-small uk-padding-remove-horizontal' : '') : ''">
<span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')" <span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')"
uk-tooltip [title]="getAccessLabel(availableOn[0].accessRight)"> uk-tooltip [title]="getAccessLabel(availableOn[0].accessRight)">
@ -65,17 +73,20 @@ import {RouterHelper} from "../../utils/routerHelper.class";
</ng-container> </ng-container>
</div> </div>
</div> </div>
</ng-container>
</div> </div>
</ng-container> </ng-container>
<ng-template #availableOnList> <ng-template #availableOnList>
<div *ngFor="let instance of availableOn let i=index" class="download-drop-item uk-flex uk-flex-top"> <div *ngFor="let instance of availableOn let i=index" class="download-drop-item uk-flex uk-flex-top"
[ngClass]="inModal ? 'uk-margin-small-bottom' : ''">
<span <span
[class]="'uk-margin-small-right ' + (instance.accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')" [class]="'uk-margin-small-right ' + (instance.accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')"
uk-tooltip [title]="getAccessLabel(instance.accessRight)"> uk-tooltip [title]="getAccessLabel(instance.accessRight)">
<icon [name]="instance.accessRightIcon" [flex]="true"></icon> <icon [name]="instance.accessRightIcon" [flex]="true" [ratio]="inModal ? 0.8 : 1"></icon>
</span> </span>
<div class="uk-width-expand uk-padding-small uk-padding-remove-left uk-padding-remove-vertical"> <div class="uk-padding-small uk-padding-remove-left uk-padding-remove-vertical"
[ngClass]="inModal ? 'uk-grid' : 'uk-width-expand'">
<span class="uk-text-emphasis"> <span class="uk-text-emphasis">
<a *ngIf="instance.downloadUrl" [href]="instance.downloadUrl" target="_blank" <a *ngIf="instance.downloadUrl" [href]="instance.downloadUrl" target="_blank"
class="title uk-link-text uk-text-bold custom-external uk-display-inline-block"> class="title uk-link-text uk-text-bold custom-external uk-display-inline-block">
@ -118,6 +129,7 @@ import {RouterHelper} from "../../utils/routerHelper.class";
export class AvailableOnComponent { export class AvailableOnComponent {
@Input() isMobile: boolean = false; @Input() isMobile: boolean = false;
@Input() inModal: boolean = false;
@Input() usedBy: "search" | "landing" = "search"; @Input() usedBy: "search" | "landing" = "search";
@Input() prevPath: string = ""; @Input() prevPath: string = "";
@Input() availableOn: HostedByCollectedFrom[]; @Input() availableOn: HostedByCollectedFrom[];

21
utils/result-preview/result-preview.component.html
View File

@ -185,16 +185,16 @@
<!-- </div>--> <!-- </div>-->
</div> </div>
</div> </div>
<div *ngIf="(result.hostedBy_collectedFrom || hasActions || result.measure?.bip.length || result.measure?.counts.length) && !isDeletedByInferenceModal" <div *ngIf="(result.hostedBy_collectedFrom || ((hasActions || result.measure?.bip.length || result.measure?.counts.length) && !isDeletedByInferenceModal))"
class="uk-text-small uk-margin-top" [class.uk-border-bottom]="!isMobile"> class="uk-text-small uk-margin-top" [class.uk-border-bottom]="!isMobile">
<div uk-grid class="uk-grid uk-grid-small uk-text-xsmall uk-flex-middle uk-margin-xsmall-bottom" <div uk-grid class="uk-grid uk-grid-small uk-text-xsmall uk-flex-middle uk-margin-xsmall-bottom"
[class.uk-flex-between]="(result.measure?.bip.length || result.measure?.counts.length) && (result.hostedBy_collectedFrom?.length || hasActions)" [class.uk-flex-between]="!isDeletedByInferenceModal && (result.measure?.bip.length || result.measure?.counts.length) && (result.hostedBy_collectedFrom?.length || hasActions)"
[class.uk-flex-right]="!(result.measure?.bip.length || result.measure?.counts.length) && (result.hostedBy_collectedFrom?.length || hasActions)" [class.uk-flex-right]="!isDeletedByInferenceModal && !(result.measure?.bip.length || result.measure?.counts.length) && (result.hostedBy_collectedFrom?.length || hasActions)"
[class.uk-grid-divider]="!isMobile"> [class.uk-grid-divider]="!isMobile">
<div *ngIf="result.hostedBy_collectedFrom?.length" class="uk-width-auto uk-visible@m"> <div *ngIf="result.hostedBy_collectedFrom?.length" class="uk-width-auto uk-visible@m">
<availableOn [availableOn]="result.hostedBy_collectedFrom"></availableOn> <availableOn [availableOn]="result.hostedBy_collectedFrom" [inModal]="isDeletedByInferenceModal"></availableOn>
</div> </div>
<div *ngIf="hasActions && result.id" class="uk-width-expand uk-visible@m"> <div *ngIf="!isDeletedByInferenceModal && hasActions && result.id" class="uk-width-expand uk-visible@m">
<entity-actions [cite]="cite" [share]="share" [linking]="linking" <entity-actions [cite]="cite" [share]="share" [linking]="linking"
[deposit]="deposit" [embed]="embed" [deposit]="deposit" [embed]="embed"
[type]="result.resultType" [type]="result.resultType"
@ -222,7 +222,7 @@
</span> </span>
</entity-actions> </entity-actions>
</div> </div>
<div *ngIf="result.measure?.bip.length || result.measure?.counts.length" <div *ngIf="!isDeletedByInferenceModal && (result.measure?.bip.length || result.measure?.counts.length)"
class="uk-text-xsmall uk-width-auto metrics uk-flex uk-flex-middle uk-flex-right uk-text-meta"> class="uk-text-xsmall uk-width-auto metrics uk-flex uk-flex-middle uk-flex-right uk-text-meta">
<ng-container *ngIf="result.measure?.bip.length"> <ng-container *ngIf="result.measure?.bip.length">
<a class="uk-flex uk-flex-middle uk-link-reset"> <a class="uk-flex uk-flex-middle uk-link-reset">
@ -275,7 +275,13 @@
</div> </div>
</ng-container> </ng-container>
</div> </div>
<div *ngIf="result.hostedBy_collectedFrom?.length || hasActions" class="uk-hidden@m"> <div *ngIf="result.hostedBy_collectedFrom?.length || (hasActions && !isDeletedByInferenceModal)" class="uk-hidden@m">
<ng-container *ngIf="isDeletedByInferenceModal && result.hostedBy_collectedFrom?.length">
<availableOn [availableOn]="result.hostedBy_collectedFrom" [inModal]="isDeletedByInferenceModal"></availableOn>
<div class="uk-nav-divider"></div>
</ng-container>
<ng-container *ngIf="!isDeletedByInferenceModal">
<a class="uk-link-reset uk-flex uk-flex-middle"> <a class="uk-link-reset uk-flex uk-flex-middle">
<icon [flex]="true" name="more_vert"></icon> <icon [flex]="true" name="more_vert"></icon>
</a> </a>
@ -317,6 +323,7 @@
</ng-container> </ng-container>
</ul> </ul>
</div> </div>
</ng-container>
</div> </div>
</div> </div>
</div> </div>