From f9ff62f18807f274df29b77fc255604ccabc8296 Mon Sep 17 00:00:00 2001 From: "konstantina.galouni" Date: Tue, 21 Feb 2023 16:10:21 +0200 Subject: [PATCH] [Library | explore-redesign]: Mobile redesign for the 3 buttons at the bottom (main info, metrics, actions) and their contents. 1. availableOn.component.ts: Mobile redesign - open in full screen modal instead of drop | icons updated. 2. fos.component.ts: In mobile show {{title}} instead of hardcoded title. 3. resultLandingUtils.module.ts: Imported FullScreenModalModule. 4. deletedByInference.component.ts: Removed class "uk-list-divider" for - after redesign each result has its own bottom border. 5. orcid.module.ts: Imported FullScreenModalModule. 6. orcid-work.component.ts: Mobile redesign - Added full screen modals propagationFsModal and grantFsModal. 7. resultLanding.component.ts: Added citeFsModal, addThisFsModal, alertModalDeletedByInferenceFS and property public mobileContent: "info" | "metrics" | "actions" = "info". 8. resultLanding.component.html: Mobile redesign for the 3 buttons at the bottom (main info, metrics, actions). --- .../landing-utils/availableOn.component.ts | 130 ++-- landingPages/landing-utils/fos.component.ts | 2 +- .../resultLandingUtils.module.ts | 3 +- .../deletedByInference.component.ts | 2 +- .../result/resultLanding.component.html | 616 ++++++++++-------- .../result/resultLanding.component.ts | 4 + orcid/orcid-work.component.ts | 78 ++- orcid/orcid.module.ts | 3 +- 8 files changed, 512 insertions(+), 326 deletions(-) diff --git a/landingPages/landing-utils/availableOn.component.ts b/landingPages/landing-utils/availableOn.component.ts index c38c37ac..c118dfec 100644 --- a/landingPages/landing-utils/availableOn.component.ts +++ b/landingPages/landing-utils/availableOn.component.ts @@ -2,6 +2,7 @@ import {Component, ElementRef, EventEmitter, Input, Output, ViewChild} from '@an import {HostedByCollectedFrom} from "../../utils/result-preview/result-preview"; import {properties} from "../../../../environments/environment"; import {StringUtils} from '../../utils/string-utils.class'; +import {FullScreenModalComponent} from "../../utils/modal/full-screen-modal/full-screen-modal.component"; declare var UIkit; @@ -15,66 +16,89 @@ declare var UIkit; uk-tooltip [title]="availableOn[0].accessRight ? availableOn[0].accessRight : 'Not available'"> - - {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} - - - - -
-
- - - -
- - - {{instance.downloadNames.join("; ")}} - - -
- {{instance.types.join(" . ")}} - . - {{instance.years.join(" . ")}} -
-
- License: - - {{instance.license}} - - {{instance.license}} -
-
- Providers: - - {{collectedName}} - ; - -
-
-
-
- + + + {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} + + + + + +
+ +
+ + + + + {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} + + + + + +
+ +
+ + + + + +
+ + + +
+ + + {{instance.downloadNames.join("; ")}} + + +
+ {{instance.types.join(" . ")}} + . + {{instance.years.join(" . ")}} +
+
+ License: + + {{instance.license}} + + {{instance.license}} +
+
+ Providers: + + {{collectedName}} + ; + +
+
+
+ ` }) export class AvailableOnComponent { + @Input() isMobile: boolean = false; + @Input() usedBy: "search" | "landing" = "search"; @Input() availableOn: HostedByCollectedFrom[]; /** @deprecated */ @Output() viewAllClicked = new EventEmitter(); @ViewChild("dropElement") dropElement: ElementRef; + @ViewChild("availableListFsModal") availableListFsModal: FullScreenModalComponent; public threshold: number = 1; public dataProviderUrl = properties.searchLinkToDataProvider.split('?')[0]; public title: string = "Download from"; @@ -100,4 +124,10 @@ export class AvailableOnComponent { public sliceString(str: string, size: number) { return StringUtils.sliceString(str, size) } + + public openAvailableListFsModal() { + this.availableListFsModal.title = "Sources"; + this.availableListFsModal.okButton = false; + this.availableListFsModal.open(); + } } diff --git a/landingPages/landing-utils/fos.component.ts b/landingPages/landing-utils/fos.component.ts index 4b3236ec..a33e2377 100644 --- a/landingPages/landing-utils/fos.component.ts +++ b/landingPages/landing-utils/fos.component.ts @@ -38,7 +38,7 @@ import {StringUtils} from "../../utils/string-utils.class";
Beta
- Fields of Science (FoS) + {{title}}
diff --git a/landingPages/landing-utils/resultLandingUtils.module.ts b/landingPages/landing-utils/resultLandingUtils.module.ts index 6dac417f..a8079694 100644 --- a/landingPages/landing-utils/resultLandingUtils.module.ts +++ b/landingPages/landing-utils/resultLandingUtils.module.ts @@ -20,12 +20,13 @@ import { SearchInputModule } from '../../sharedComponents/search-input/search-in import {EntityMetadataComponent} from "./entity-metadata.component"; import {IconsService} from "../../utils/icons/icons.service"; import {closed_access, open_access} from "../../utils/icons/icons"; +import {FullScreenModalModule} from "../../utils/modal/full-screen-modal/full-screen-modal.module"; @NgModule({ imports: [ CommonModule, FormsModule, RouterModule, PagingModule, ShowPublisherModule, IconsModule, AlertModalModule, - SearchInputModule + SearchInputModule, FullScreenModalModule ], declarations: [ ShowIdentifiersComponent,ShowSubjectsComponent, diff --git a/landingPages/result/deletedByInference/deletedByInference.component.ts b/landingPages/result/deletedByInference/deletedByInference.component.ts index 52cd3781..cb17172e 100644 --- a/landingPages/result/deletedByInference/deletedByInference.component.ts +++ b/landingPages/result/deletedByInference/deletedByInference.component.ts @@ -24,7 +24,7 @@ import {HelperFunctions} from "../../../utils/HelperFunctions.class"; [page]="page" [pageSize]="pageSize" [totalResults]="results.length"> -
    +
      • diff --git a/landingPages/result/resultLanding.component.html b/landingPages/result/resultLanding.component.html index 19f43f81..0c9c8049 100644 --- a/landingPages/result/resultLanding.component.html +++ b/landingPages/result/resultLanding.component.html @@ -324,241 +324,8 @@
-
- -
    - -
  • -
    -
    -
    -
    -
    - BIP! -
    - Impact by - BIP! -
    -
    - - - - - - - - - - - - - - - - - - - - - - - -
    - - - Citations - - {{resultLandingInfo.measure.citations | number}} -
    - - - Popularity - - {{resultLandingInfo.measure.popularity}} -
    - - - Influence - - {{resultLandingInfo.measure.influence}} -
    - - - Impulse - - {{resultLandingInfo.measure.impulse}} -
    -
    -
    -
    -
    - -
    -
    -
    -
    -
    - OpenAIRE UsageCounts -
    - Usage by - UsageCounts -
    -
    - - - - - - - - - - - - - -
    - - - Downloads - - {{formatNumber(resultLandingInfo.measure.downloads)}} -
    - - - Views - - {{formatNumber(resultLandingInfo.measure.views)}} -
    -
    -
    -
    -
    -
    • - -
  • -
    -
    - - - - - - - - - - - - - - - - - - - - - - - -
    - - - Citations - - {{resultLandingInfo.measure.citations}} -
    - - - Popularity - - {{resultLandingInfo.measure.popularity}} -
    - - - Influence - - {{resultLandingInfo.measure.influence}} -
    - - - Impulse - - {{resultLandingInfo.measure.impulse}} -
    -
    -
    - -
    -
    -
    - Powered by - BIP! - BIP! -
    -
    • - -
  • - -
    • - -
  • -
    -
    -
    -
    {{formatNumber(resultLandingInfo.measure.downloads)}}
    -
    Downloads
    -
    -
    -
    {{formatNumber(resultLandingInfo.measure.views)}}
    -
    Views
    -
    -
    - -
    - -
    -
    - - -
    -     -
    -
    - Powered by - OpenAIRE UsageCounts -
    -
    • -
-
- + +
-
+
@@ -783,10 +550,82 @@
-
-
+
+ +
+
+ +
+ +
+
+ + +
+ + + View all {{resultLandingInfo.deletedByInferenceIds.length}} versions + +
+
+ + +
+ + Share +
+
+ + +
+ + Cite +
+
+ + +
+ + +
+
+ + + + + + + + + + + + + + + Link to + + +
+ + +
+ +
+
- + - -
-
- + - + - + - +
- + - + @@ -908,8 +748,7 @@ [type]="title.toLowerCase()" [piwikSiteId]="piwikSiteId"> - + @@ -1149,4 +988,269 @@ - \ No newline at end of file + + + +
+ +
    + +
  • +
    +
    +
    +
    +
    + BIP! +
    + Impact by + BIP! +
    +
    + + + + + + + + + + + + + + + + + + + + + + + +
    + + + Citations + + {{resultLandingInfo.measure.citations | number}} +
    + + + Popularity + + {{resultLandingInfo.measure.popularity}} +
    + + + Influence + + {{resultLandingInfo.measure.influence}} +
    + + + Impulse + + {{resultLandingInfo.measure.impulse}} +
    +
    +
    +
    +
    + +
    +
    +
    +
    +
    + OpenAIRE UsageCounts +
    + Usage by + UsageCounts +
    +
    + + + + + + + + + + + + + +
    + + + Downloads + + {{formatNumber(resultLandingInfo.measure.downloads)}} +
    + + + Views + + {{formatNumber(resultLandingInfo.measure.views)}} +
    +
    +
    +
    +
    +
    • + +
  • +
    +
    + + + + + + + + + + + + + + + + + + + + + + + +
    + + + Citations + + {{resultLandingInfo.measure.citations}} +
    + + + Popularity + + {{resultLandingInfo.measure.popularity}} +
    + + + Influence + + {{resultLandingInfo.measure.influence}} +
    + + + Impulse + + {{resultLandingInfo.measure.impulse}} +
    +
    +
    + +
    +
    +
    + Powered by + BIP! + BIP! +
    +
    • + +
  • + +
    • + +
  • +
    +
    +
    +
    {{formatNumber(resultLandingInfo.measure.downloads)}}
    +
    Downloads
    +
    +
    +
    {{formatNumber(resultLandingInfo.measure.views)}}
    +
    Views
    +
    +
    + +
    + +
    +
    + + +
    +     +
    +
    + Powered by + OpenAIRE UsageCounts +
    +
    • +
+
+ + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/landingPages/result/resultLanding.component.ts b/landingPages/result/resultLanding.component.ts index 2ed5f2f1..d46561ee 100644 --- a/landingPages/result/resultLanding.component.ts +++ b/landingPages/result/resultLanding.component.ts @@ -43,8 +43,11 @@ export class ResultLandingComponent { enermapsId; // @ViewChild('linkModal') linkModal; @ViewChild('citeModal') citeModal; + @ViewChild('citeFsModal') citeFsModal; @ViewChild('addThisModal') addThisModal; + @ViewChild('addThisFsModal') addThisFsModal; @ViewChild('AlertModalDeletedByInference') alertModalDeletedByInference; + @ViewChild('AlertModalDeletedByInferenceFS') alertModalDeletedByInferenceFS; // @ViewChild('relationModal') relationModal; public deleteByInferenceOpened: boolean = false; @Input() public resultFromInput: boolean = false; @@ -144,6 +147,7 @@ export class ResultLandingComponent { // public shouldSticky: boolean = true; + public mobileContent: "info" | "metrics" | "actions" = "info"; public tabMobile: string = ""; public viewAllMobile: string = ""; public viewAll: string = ""; diff --git a/orcid/orcid-work.component.ts b/orcid/orcid-work.component.ts index 43a86311..f914a905 100644 --- a/orcid/orcid-work.component.ts +++ b/orcid/orcid-work.component.ts @@ -11,6 +11,7 @@ import {ExternalIDV3_0, WorkV3_0} from "./orcidWork"; import {EnvProperties} from "../utils/properties/env-properties"; import {UserManagementService} from "../services/user-management.service"; import {OpenaireEntities} from "../utils/properties/searchFields"; +import {FullScreenModalComponent} from "../utils/modal/full-screen-modal/full-screen-modal.component"; declare var UIkit: any; @@ -22,7 +23,8 @@ declare var UIkit: any; [attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'" [title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipAdd"> @@ -39,7 +41,8 @@ declare var UIkit: any; [attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'" [title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipDelete"> @@ -68,7 +71,7 @@ declare var UIkit: any; --> - +
{{requestGrantMessage}}
@@ -91,6 +94,13 @@ declare var UIkit: any;
+ + +
{{requestGrantMessage}}
+ + @@ -279,10 +289,32 @@ declare var UIkit: any; + + +
+ This {{openaireEntities.RESULT}} is the result of merged {{openaireEntities.RESULTS}} in OpenAIRE. +

+ You have already added {{this.putCodes?.length}} works in your ORCID record + related to the merged {{openaireEntities.RESULT}}. +
+ If you continue with delete action, all these works will be deleted. +
+
+ If you continue with update action, all these works will be deleted and a new merged work will be added + instead. +
+
+ + + ` }) export class OrcidWorkComponent { + @Input() isMobile: boolean = false; @Input() resultId: string = ""; @Input() resultTitle: string = ""; @Input() resultLandingInfo: ResultLandingInfo; @@ -299,9 +331,11 @@ export class OrcidWorkComponent { @ViewChild('workModal') workModal; // @ViewChild('saveWorkModal') saveWorkModal; @ViewChild('grantModal') grantModal; + @ViewChild('grantFsModal') grantFsModal: FullScreenModalComponent; // @ViewChild('messageModal') messageModal; @ViewChild('propagationModal') propagationModal; - + @ViewChild('propagationFsModal') propagationFsModal; + public requestGrant: boolean = false; public requestGrantMessage: string = "Please grant OpenAIRE to access and update your ORCID works."; private tokenUrl: string; @@ -720,12 +754,18 @@ export class OrcidWorkComponent { } openGrantModal(title: string) { - this.grantModal.cancelButton = true; - this.grantModal.okButton = true; - this.grantModal.okButtonText = "Grant OpenAIRE"; - this.grantModal.okButtonLeft = false; - this.grantModal.alertTitle = title; - this.grantModal.open(); + if(this.isMobile) { + this.grantFsModal.okButton = false; + this.grantFsModal.title = title; + this.grantFsModal.open(); + } else { + this.grantModal.cancelButton = true; + this.grantModal.okButton = true; + this.grantModal.okButtonText = "Grant OpenAIRE"; + this.grantModal.okButtonLeft = false; + this.grantModal.alertTitle = title; + this.grantModal.open(); + } } closeGrantModal() { @@ -755,12 +795,18 @@ export class OrcidWorkComponent { // } openPropagationModal(title: string) { - this.propagationModal.cancelButton = true; - this.propagationModal.okButton = true; - this.propagationModal.okButtonText = "Continue"; - this.propagationModal.okButtonLeft = false; - this.propagationModal.alertTitle = title; - this.propagationModal.open(); + if(this.isMobile) { + this.propagationFsModal.okButton = false; + this.propagationFsModal.title = title; + this.propagationFsModal.open(); + } else { + this.propagationModal.cancelButton = true; + this.propagationModal.okButton = true; + this.propagationModal.okButtonText = "Continue"; + this.propagationModal.okButtonLeft = false; + this.propagationModal.alertTitle = title; + this.propagationModal.open(); + } } closePropagationModal() { diff --git a/orcid/orcid.module.ts b/orcid/orcid.module.ts index 9ff2bdfd..fd8428e0 100644 --- a/orcid/orcid.module.ts +++ b/orcid/orcid.module.ts @@ -15,11 +15,12 @@ import {ResultLandingUtilsModule} from '../landingPages/landing-utils/resultLand import {IconsModule} from '../utils/icons/icons.module'; import {IconsService} from "../utils/icons/icons.service"; import {orcid_add, orcid_bin} from "../utils/icons/icons"; +import {FullScreenModalModule} from "../utils/modal/full-screen-modal/full-screen-modal.module"; @NgModule({ imports: [ CommonModule, RouterModule, AlertModalModule, LoadingModule, ResultLandingUtilsModule, - IconsModule + IconsModule, FullScreenModalModule ], declarations: [ OrcidComponent,