search page - results: add mobile actions, display authors and pids (but not in "other versions" section

This commit is contained in:
Alex Martzios 2023-06-07 11:09:43 +03:00
parent 412ed213fe
commit 8f492223d0
7 changed files with 80 additions and 30 deletions

View File

@ -11,7 +11,7 @@ import {RouterHelper} from "../../utils/routerHelper.class";
selector: 'availableOn',
template: `
<ng-container *ngIf="availableOn && availableOn.length > 0">
<div class="uk-flex uk-flex-middle">
<div class="uk-flex uk-flex-middle" [ngClass]="isMobile && !(usedBy == 'landing') ? 'uk-margin-left uk-margin-xsmall-bottom' : ''">
<ng-container *ngIf="availableOn[0].downloadUrl">
<span [class]="'uk-margin-xsmall-right ' + (availableOn[0].accessRightIcon == 'open_access' ? 'open-access' : 'closed-access')"
uk-tooltip [title]="getAccessLabel(availableOn[0].accessRight)">
@ -19,15 +19,15 @@ import {RouterHelper} from "../../utils/routerHelper.class";
</span>
<ng-container *ngIf="!(isMobile && usedBy == 'landing')">
<a uk-tooltip="Source" target="_blank"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
<span>{{sliceString(availableOn[0].downloadNames.join("; "), 20)}}</span>
<span>
<!-- <icon [flex]="true" [name]="'expand_' + (isOpen?'less':'more')"></icon>-->
<!-- <icon [flex]="true" [name]="'expand_' + (isOpen?'less':'more')"></icon>-->
<icon [flex]="true" [name]="(isOpen?'arrow_drop_up':'arrow_drop_down')"></icon>
</span>
</a>
<div #dropElement uk-drop="mode: click; pos: bottom-left;"
class="uk-drop download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small uk-height-max-large uk-overflow-auto">
class="uk-drop download-drop uk-card uk-card-default uk-padding-small uk-padding-remove-horizontal uk-text-small uk-height-max-large uk-overflow-auto">
<ng-container *ngTemplateOutlet="availableOnList"></ng-container>
</div>
</ng-container>

View File

@ -27,7 +27,7 @@ import {HelperFunctions} from "../../../utils/HelperFunctions.class";
<ul class="uk-list uk-list-divider uk-margin">
<li *ngFor="let result of results.slice((page-1)*pageSize, page*pageSize)">
<result-preview [modal]="modal" [properties]="properties" [hasLink]="false" [result]="getResultPreview(result)"
[isCard]="false" [prevPath]="prevPath"></result-preview>
[isCard]="false" [prevPath]="prevPath" [isDeletedByInferenceModal]="true"></result-preview>
</li>
</ul>
<no-load-paging *ngIf="results.length > pageSize" [type]="type"

View File

@ -27,7 +27,8 @@ import {HelperFunctions} from "../../../utils/HelperFunctions.class";
<ul class="uk-list uk-margin">
<li *ngFor="let result of results.slice((page-1)*pageSize, page*pageSize)">
<result-preview [modal]="modal" [properties]="properties" [hasLink]="false" [result]="getResultPreview(result)"
[showOrcid]="false" [isCard]="false" [prevPath]="prevPath" [showInline]="true"></result-preview>
[showOrcid]="false" [isCard]="false" [prevPath]="prevPath" [showInline]="true"
[isDeletedByInferenceModal]="true"></result-preview>
</li>
</ul>
<no-load-paging *ngIf="results.length > pageSize" [type]="type"

View File

@ -23,7 +23,8 @@ declare var UIkit: any;
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'"
[title]="((!pids && (!identifiers || identifiers.size == 0)) || !isLoggedIn) ? ((!pids && (!identifiers || identifiers.size == 0)) ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipAdd">
<a (click)="currentAction='add'; saveWorkPreparation();"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link"
class="uk-flex uk-flex-middle uk-button-link"
[ngClass]="isMobile && !(pageType == 'landing') ? 'uk-margin-left' : 'uk-flex-center'"
[class.uk-text-bolder]="!(isMobile && pageType == 'landing')"
[class.uk-disabled]="showLoading || !isLoggedIn || (!pids && (!identifiers || identifiers.size == 0))"
[class.uk-text-muted]="showLoading || !isLoggedIn || (!pids && (!identifiers || identifiers.size == 0))"
@ -41,7 +42,8 @@ declare var UIkit: any;
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'"
[title]="((!pids && (!identifiers || identifiers.size == 0)) || !isLoggedIn) ? ((!pids && (!identifiers || identifiers.size == 0)) ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipDelete">
<a (click)="currentAction='delete'; deleteWorks();"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link"
class="uk-flex uk-flex-middle uk-button-link"
[ngClass]="isMobile && !(pageType == 'landing') ? 'uk-margin-left' : 'uk-flex-center'"
[class.uk-text-bolder]="!(isMobile && pageType == 'landing')"
[class.uk-disabled]="showLoading || !isLoggedIn || (!pids && (!identifiers || identifiers.size == 0))"
[class.uk-text-muted]="showLoading || !isLoggedIn || (!pids && (!identifiers || identifiers.size == 0))"

View File

@ -10,45 +10,45 @@ import {EnvProperties} from "../properties/env-properties";
@Component({
selector: 'entity-actions',
template: `
<div class="uk-grid uk-grid-small uk-child-width-auto" uk-grid>
<div class="" [ngClass]="isMobile ? 'uk-flex uk-flex-column' : 'uk-grid uk-grid-small uk-child-width-auto'" [attr.uk-grid]="!isMobile ? '' : null">
<div *ngIf="linking && isRouteAvailable('participate/direct-claim')">
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'], [id,type,linkTo])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"
[title]="'Link '+openaireEntities.RESULTS+' with a '+openaireEntities.PROJECT+', a '+openaireEntities.COMMUNITY+' or other '+openaireEntities.RESULTS+' and make the new information available in OpenAIRE information space.'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"
[title]="'Link '+openaireEntities.RESULTS+' with a '+openaireEntities.PROJECT+', a '+openaireEntities.COMMUNITY+' or other '+openaireEntities.RESULTS+' and make the new information available in OpenAIRE information space.'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-button-link uk-text-bolder" [ngClass]="isMobile ? 'uk-margin-left uk-margin-xsmall-bottom' : 'uk-flex-center'">
<icon [flex]="true" [ratio]="0.7" name="link_to" visuallyHidden="link"></icon>
<span class="uk-margin-xsmall-left">Link to</span>
</a>
</div>
<div *ngIf="share">
<a (click)="openAddThisModal()"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
class="uk-flex uk-flex-middle uk-button-link uk-text-bolder" [ngClass]="isMobile ? 'uk-margin-left uk-margin-xsmall-bottom' : 'uk-flex-center'">
<icon [flex]="true" [ratio]="0.8" name="share" visuallyHidden="share"></icon>
<span class="uk-margin-xsmall-left">Share</span>
</a>
</div>
<div *ngIf="cite">
<a (click)="openCiteModal()"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
class="uk-flex uk-flex-middle uk-button-link uk-text-bolder" [ngClass]="isMobile ? 'uk-margin-left uk-margin-xsmall-bottom' : 'uk-flex-center'">
<icon [flex]="true" [ratio]="0.7" name="cite" visuallyHidden="cite"></icon>
<span class="uk-margin-xsmall-left">Cite</span>
</a>
</div>
<div *ngIf="deposit && isRouteAvailable('participate/deposit/learn-how')">
<a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how"
[title]="'Find a repository to deposit or publish your research in Open Access'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
[title]="'Find a repository to deposit or publish your research in Open Access'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-button-link uk-text-bolder" [ngClass]="isMobile ? 'uk-margin-left uk-margin-xsmall-bottom' : 'uk-flex-center'">
<icon flex="true" ratio="0.7" name="upload" visuallyHidden="upload"></icon>
<span class="uk-margin-xsmall-left">Deposit</span>
</a>
</div>
<div *ngIf="embed" >
<a (click)="openEmbedResultsModal()"
[title]="'Embed the related '+openaireEntities.RESULTS+' of this '+getTypeName()+' in your website'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
[title]="'Embed the related '+openaireEntities.RESULTS+' of this '+getTypeName()+' in your website'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small uk-width-medium'"
class="uk-flex uk-flex-middle uk-button-link uk-text-bolder" [ngClass]="isMobile ? 'uk-margin-left uk-margin-xsmall-bottom' : 'uk-flex-center'">
<icon flex="true" ratio="0.8" name="code" visuallyHidden="code"></icon>
<span class="uk-margin-xsmall-left">Embed</span>
</a>
@ -66,7 +66,7 @@ import {EnvProperties} from "../properties/env-properties";
<div class="uk-padding-small uk-margin-small-left uk-margin-small-right">
<div class="uk-padding-small uk-padding-remove-vertical">
<div input type="select" placeholder="Select content type to embed" inputClass="flat x-small"
[options]="resultTypesForEmbedding" [(value)]="embed_research_results_type"></div>
[options]="resultTypesForEmbedding" [(value)]="embed_research_results_type"></div>
<div *ngIf="embed_research_results_type" class="clipboard-wrapper box-content uk-grid uk-margin-auto uk-margin-small-top ">
<pre id="dynamic_content_id" class="uk-overflow-auto uk-padding-small uk-padding-remove-vertical uk-margin-top"><code
>{{getDynamicContent(embed_research_results_type)}}</code></pre>
@ -96,6 +96,7 @@ export class EntityActionsComponent implements OnInit {
@Input() deposit: boolean = false;
@Input() embed: boolean = false;
@Input() url: string;
@Input() isMobile: boolean = false;
public citeThisClicked: boolean;
public routerHelper: RouterHelper = new RouterHelper();
@ViewChild('citeModal') citeModal;

View File

@ -91,7 +91,7 @@
</div>
</div>
<!-- 2nd section (funders, budget, authors, PIDs, publisher etc.) -->
<div class="uk-text-small uk-margin-small-bottom uk-visible@m">
<div class="uk-text-small uk-margin-small-bottom">
<!-- Funder -->
<div *ngIf="result.funderShortname || result.code" class="uk-margin-xsmall-bottom">
<span *ngIf="result.funderShortname">
@ -171,10 +171,12 @@
</div>
</div>
</div>
<div *ngIf="result.hostedBy_collectedFrom || hasActions || result.measure?.bip.length || result.measure?.counts.length"
class="uk-text-small uk-margin-top" [class.uk-border-bottom]="!isMobile"
[class.uk-visible@m]="!result.measure?.bip.length && result.measure?.counts.length">
<div class="uk-grid uk-grid-small uk-flex-between uk-text-xsmall uk-flex-middle uk-grid-divider uk-margin-xsmall-bottom" uk-grid>
<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">
<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-right]="!(result.measure?.bip.length || result.measure?.counts.length) && (result.hostedBy_collectedFrom?.length || hasActions)"
[class.uk-grid-divider]="!isMobile">
<div *ngIf="result.hostedBy_collectedFrom?.length" class="uk-width-auto uk-visible@m">
<availableOn [availableOn]="result.hostedBy_collectedFrom"></availableOn>
</div>
@ -207,7 +209,7 @@
</entity-actions>
</div>
<div *ngIf="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">
<a class="uk-flex uk-flex-middle uk-link-reset">
<icon customClass="bip-icon-hover" [flex]="true" [ratio]="0.7"
@ -226,7 +228,7 @@
</table>
<div class="uk-margin-top uk-flex uk-flex-middle uk-flex-center">
<img class="uk-margin-xsmall-right" width="15" src="assets/common-assets/bip-minimal.svg"
loading="lazy" alt="BIP!">
loading="lazy" alt="BIP!">
<span class="uk-text-uppercase">Powered by <span class="uk-text-bolder">BIP!</span></span>
</div>
</div>
@ -250,11 +252,54 @@
<div class="uk-margin-top uk-flex uk-flex-middle uk-flex-center">
<span class="uk-text-uppercase">Powered by </span>
<img class="uk-margin-xsmall-left" width="15" src="assets/common-assets/logo-small-usage-counts.png"
loading="lazy" alt="BIP!">
loading="lazy" alt="BIP!">
</div>
</div>
</ng-container>
</div>
<div *ngIf="result.hostedBy_collectedFrom?.length || hasActions" class="uk-hidden@m">
<a class="uk-link-reset uk-flex uk-flex-middle">
<icon [flex]="true" name="more_vert"></icon>
</a>
<div class="uk-dropdown" uk-dropdown="mode: click; pos: top-left; offset: 5; delay-hide: 0"> <!-- #element -->
<ul class="uk-nav uk-dropdown-nav">
<ng-container *ngIf="result.hostedBy_collectedFrom?.length">
<availableOn [availableOn]="result.hostedBy_collectedFrom" [isMobile]="isMobile"></availableOn>
<div class="uk-nav-divider"></div>
</ng-container>
<ng-container *ngIf="hasActions">
<entity-actions [cite]="cite" [share]="share" [linking]="linking"
[deposit]="deposit" [embed]="embed"
[type]="result.resultType"
[result]="result" [id]="result.objId?result.objId:result.id"
[url]="properties.domain + properties.baseLink + url + '?' + urlParam + '=' + result.id"
[isMobile]="isMobile">
<span *ngIf="orcid">
<orcid-work *ngIf="showOrcid && result.identifiers && result.identifiers.size > 0"
[resultId]="result.relcanId" [resultTitle]="result.title"
[type]="result.resultType" [pageType]="'search'"
[putCodes]="result.orcidPutCodes" [givenPutCode]="true" [identifiers]="result.identifiers"
[isMobile]="isMobile">
</orcid-work>
</span>
<span *ngIf="orcid" class="uk-width-expand uk-text-right">
<span *ngIf="result.orcidCreationDates?.length > 0" class="uk-display-inline-block">
<span class="uk-text-meta">
Added in ORCID:
</span>
<span *ngFor="let date of result.orcidCreationDates; let i=index">
{{date | date: 'dd MMM yyyy'}}
<span *ngIf="i < (result.orcidCreationDates.length - 1)">
&
</span>
</span>
</span>
</span>
</entity-actions>
</ng-container>
</ul>
</div>
</div>
</div>
</div>
</div>

View File

@ -38,6 +38,7 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
@Input() provenanceActionVocabulary = null;
@Input() relationsVocabulary = null;
@Input() showInline: boolean = false; // do not open modal for "view more" when this is true
@Input() isDeletedByInferenceModal: boolean = false; // do not show action bar in results when in "Other versions" modal section
/* Metadata */
public type: string;