From 7cf23698d789f68c2e2c47644f38129babb373c6 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Mon, 15 May 2023 16:47:25 +0300 Subject: [PATCH 1/2] Rename OpenAIRE Research Graph into OpenAIRE Graph and add the new logo in powered by sections. --- monitor/how/how.component.less | 299 ------------------ monitor/how/how.component.ts | 72 ----- monitor/how/how.module.ts | 12 - .../indicators/indicator-themes.component.ts | 4 +- .../methodological-approach.component.ts | 12 +- monitor/methodology/methodology.module.ts | 8 +- monitor/methodology/terminology.component.ts | 14 +- 7 files changed, 15 insertions(+), 406 deletions(-) delete mode 100644 monitor/how/how.component.less delete mode 100644 monitor/how/how.component.ts delete mode 100644 monitor/how/how.module.ts diff --git a/monitor/how/how.component.less b/monitor/how/how.component.less deleted file mode 100644 index 04459c51..00000000 --- a/monitor/how/how.component.less +++ /dev/null @@ -1,299 +0,0 @@ -@import "~src/assets/openaire-theme/less/_import-variables"; - -@media only screen and (min-width: @breakpoint-small) { - .how .first > div:first-child { - position: relative; - } - - .how .first > div:first-child:after { - content: "we"; - font-size: 20px; - font-weight: 600; - text-align: center; - padding-bottom: 5%; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/1.svg"); - right: -21%; - top: 33%; - width: 20%; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } - - .how .second > div:first-child { - position: relative; - padding: 0 10% 0 20%; - } - - .how .second > div:first-child:after { - content: "and"; - font-size: 20px; - font-weight: 600; - text-align: center; - padding-bottom: 5%; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/2.svg"); - right: -17%; - top: 33%; - width: 30%; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } - - .how .third { - position: relative; - } - - .how .third > div:first-child { - padding: 0 14% 0 13%; - } - - .how .third:after { - content: "on which"; - font-size: 20px; - font-weight: 600; - padding-right: 30%; - padding-top: 5%; - padding-bottom: 5%; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - bottom: -6%; - left: 13%; - transform: translateY(100%); - width: 140px; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .fourth { - padding: 10% 3% 0 3%; - } - - .how .fourth > div:first-child { - position: relative; - padding: 0 16% 0 16%; - } - - .how .fourth> div:first-child:after { - content: "and"; - font-size: 20px; - font-weight: 600; - text-align: center; - padding-bottom: 5%; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/4.svg"); - left: -18%; - top: 36%; - width: 30%; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } - - .how .fifth { - padding: 11% 2% 0 2%; - } - - .how .fifth > div:first-child { - position: relative; - } - - .how .fifth > div:first-child:after { - content: "We"; - font-size: 20px; - font-weight: 600; - text-align: center; - padding-bottom: 5%; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/5.svg"); - left: -35%; - top: 36%; - width: 30%; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } - - .how .sixth { - padding: 10% 5% 0 0; - } - - .how .sixth > div:first-child { - padding: 0 15% 0 15%; - } - - .how .final { - padding: 10% 20% 0 20%; - } - - .how .final > div:first-child { - position: relative; - } - - .how .final > div:first-child:before { - content: ""; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/6.svg"); - left: -26%; - top: -20%; - height: 70%; - width: 30%; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } - - .how .final > div:first-child:after { - content: "We make visualizations, graphs, reports and deliver all in a customisable tool"; - font-size: 20px; - position: absolute; - top: 30%; - width: 250px; - padding: 8% 0 5% 0; - background-size: contain; - background-repeat: no-repeat; - background-position: bottom center; - } -} - -@media only screen and (max-width: @breakpoint-xsmall-max) { - .how .first { - position: relative; - padding-bottom: 30%; - } - - .how .first:after { - content: "we"; - text-align: center; - padding: 10% 34% 10% 0; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - left: 26%; - top: 79%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .second { - position: relative; - padding: 0 10% 30% 10%; - } - - .how .second:after { - content: "and"; - text-align: center; - padding: 10% 34% 10% 0; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - left: 25%; - top: 80%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .third { - position: relative; - padding: 0 5% 30% 5%; - } - - .how .third:after { - content: "on which"; - font-weight: bold; - text-align: center; - padding: 10% 41% 10% 0; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - left: 15%; - top: 83%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .fourth { - position: relative; - padding: 0 0 30% 0; - } - - .how .fourth > div:first-child { - padding: 0 10% 0 10%; - } - - .how .fourth:after { - content: "and"; - text-align: center; - padding: 10% 34% 10% 0; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - left: 26%; - top: 79%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .fifth { - position: relative; - padding: 0 2% 30% 2%; - } - - .how .fifth:after { - content: "We"; - text-align: center; - padding: 10% 34% 10% 0; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg"); - left: 27%; - top: 76%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .sixth { - padding: 0 5% 30% 0; - } - - .how .sixth > div:first-child { - padding: 0 15% 0 15%; - } - - .how .final { - padding: 20% 0 20% 0; - } - - .how .final > div:first-child { - position: relative; - } - - .how .final > div:first-child:before { - content: ""; - position: absolute; - background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/6.svg"); - left: 34%; - top: -70%; - height: 70%; - width: 30%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } - - .how .final > div:first-child:after { - content: "We make visualizations, graphs, reports and deliver all in a customisable tool"; - text-align: center; - position: absolute; - left: -62%; - top: 85%; - width: 300px; - padding: 12% 0 0 54%; - background-size: contain; - background-repeat: no-repeat; - background-position: center; - } -} diff --git a/monitor/how/how.component.ts b/monitor/how/how.component.ts deleted file mode 100644 index 251d3549..00000000 --- a/monitor/how/how.component.ts +++ /dev/null @@ -1,72 +0,0 @@ -import {Component} from "@angular/core"; - -@Component({ - selector: 'how', - template: ` -
-
-
-
- -
-
- Starting from existing
research-related data sources -
-
-
-
- -
-
-
-
- -
-
- build an open, global
and trusted Research graph -
-
-
-
-
-
- -
-
- we perform Statistical
Analysis and produce
- Open Science Indicators -
-
-
-
- -
-
- furthermore Network
Analysis producing
- Collaboration Indicators -
-
-
-
- -
-
- Often combine with external data
- (patents, social, company) and - perform
Impact Analysis to - produce
Innovation Indicators -
-
-
-
-
- -
-
-
- `, - styleUrls: ['how.component.less'] -}) -export class HowComponent { - -} diff --git a/monitor/how/how.module.ts b/monitor/how/how.module.ts deleted file mode 100644 index 781800fe..00000000 --- a/monitor/how/how.module.ts +++ /dev/null @@ -1,12 +0,0 @@ -import {NgModule} from "@angular/core"; -import {CommonModule} from "@angular/common"; -import {HowComponent} from "./how.component"; - -@NgModule({ - imports: [CommonModule], - declarations: [HowComponent], - exports: [HowComponent] -}) -export class HowModule { - -} diff --git a/monitor/indicators/indicator-themes.component.ts b/monitor/indicators/indicator-themes.component.ts index 4f48b5e2..fcb11a8e 100644 --- a/monitor/indicators/indicator-themes.component.ts +++ b/monitor/indicators/indicator-themes.component.ts @@ -26,7 +26,7 @@ import {Subscriber} from "rxjs";
Indicator themes that we are covering in the Monitor dashboards.

- This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the OpenAIRE Research Graph. We are at your disposal, should you have any recommendations! + This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the OpenAIRE Graph. We are at your disposal, should you have any recommendations!

Check out the indicator pages (for funders, @@ -50,7 +50,7 @@ import {Subscriber} from "rxjs";

Indicator themes that we are covering in the Monitor dashboards.

- This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the OpenAIRE Research Graph. We are at your disposal, should you have any recommendations! + This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the OpenAIRE Graph. We are at your disposal, should you have any recommendations!

Check out the indicator pages (for funders, diff --git a/monitor/methodology/methodological-approach.component.ts b/monitor/methodology/methodological-approach.component.ts index e4e9bffe..5ddc49c1 100644 --- a/monitor/methodology/methodological-approach.component.ts +++ b/monitor/methodology/methodological-approach.component.ts @@ -32,7 +32,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";

  • Coverage and accuracy: As detailed in graph.openaire.eu - multiple data sources are ingested in the OpenAIRE research graph for coverage to the fullest extent + multiple data sources are ingested in the OpenAIRE Graph for coverage to the fullest extent possible, in order to provide meaningful indicators.
  • Clarity and replicability: We describe our construction methodology in @@ -69,7 +69,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";

    How? It’s about open data and collaboration.

    • - Built on the OpenAire Research Graph + Built on the OpenAire Graph Linked scholarly information from open initiatives around the world. Beyond publications.
    • @@ -84,7 +84,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
    • - OpenAIRE Research Graph + OpenAIRE Graph
    @@ -105,7 +105,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
  • Coverage and accuracy: As detailed in graph.openaire.eu - multiple data sources are ingested in the OpenAIRE research graph for coverage to the fullest extent + multiple data sources are ingested in the OpenAIRE Graph for coverage to the fullest extent possible, in order to provide meaningful indicators.
  • Clarity and replicability: We describe our construction methodology in @@ -131,7 +131,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
    - OpenAIRE Research Graph + OpenAIRE Graph
    Completeness, inclusion, transparency and replicability @@ -139,7 +139,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";

    It’s about open data and collaboration.

    • - Built on the OpenAire Research Graph + Built on the OpenAire Graph Linked scholarly information from open initiatives around the world. Beyond publications.
    • diff --git a/monitor/methodology/methodology.module.ts b/monitor/methodology/methodology.module.ts index 25a8ad77..3d07357c 100644 --- a/monitor/methodology/methodology.module.ts +++ b/monitor/methodology/methodology.module.ts @@ -5,10 +5,7 @@ import {MethodolocigalApproachComponent} from "./methodological-approach.compone import {RouterModule} from "@angular/router"; import {PreviousRouteRecorder} from "../../utils/piwik/previousRouteRecorder.guard"; import {PageContentModule} from "../../dashboard/sharedComponents/page-content/page-content.module"; -import {HowModule} from "../how/how.module"; import {IconsModule} from "../../utils/icons/icons.module"; -import {IconsService} from "../../utils/icons/icons.service"; -import {graph} from "../../utils/icons/icons"; import {BreadcrumbsModule} from "../../utils/breadcrumbs/breadcrumbs.module"; import {SliderTabsModule} from "../../sharedComponents/tabs/slider-tabs.module"; import {HelperModule} from "../../utils/helper/helper.module"; @@ -32,11 +29,8 @@ import {HelperModule} from "../../utils/helper/helper.module"; component: MethodolocigalApproachComponent, canDeactivate: [PreviousRouteRecorder] } - ]), PageContentModule, HowModule, IconsModule, BreadcrumbsModule, SliderTabsModule, HelperModule], + ]), PageContentModule, IconsModule, BreadcrumbsModule, SliderTabsModule, HelperModule], exports: [TerminologyComponent, MethodolocigalApproachComponent] }) export class MethodologyModule { - constructor(private iconsService: IconsService) { - this.iconsService.registerIcons([graph]); - } } diff --git a/monitor/methodology/terminology.component.ts b/monitor/methodology/terminology.component.ts index 2e518e29..0da0c18c 100644 --- a/monitor/methodology/terminology.component.ts +++ b/monitor/methodology/terminology.component.ts @@ -42,10 +42,9 @@ declare var ResizeObserver;
      - - More information for - OpenAIRE Research Graph - . + + Powered by OpenAIRE graph +
      @@ -87,10 +86,9 @@ declare var ResizeObserver;
      - - More information for - OpenAIRE Research Graph - . + + Powered by OpenAIRE graph +
      From 99492a2f08439c96018177b1272b78db40f1d9be Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 16 May 2023 11:12:14 +0300 Subject: [PATCH 2/2] Input: Fix arrow left-right on inputs with type != chips. Fix dirty status of from and to controls for year-range type. --- sharedComponents/input/input.component.ts | 60 +++++++++++++++-------- 1 file changed, 39 insertions(+), 21 deletions(-) diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts index c6d7af71..98f4b9c4 100644 --- a/sharedComponents/input/input.component.ts +++ b/sharedComponents/input/input.component.ts @@ -353,9 +353,9 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang @HostListener('window:keydown.arrowLeft', ['$event']) arrowLeft(event: KeyboardEvent) { - if (this.focused) { - event.preventDefault(); + if (this.type === 'chips' && this.focused) { if (this.activeElement.getValue()) { + event.preventDefault(); let index = this.chips.toArray().indexOf(this.activeElement.getValue()); if (index > 0) { this.activeElement.next(this.chips.get(index - 1)); @@ -367,9 +367,9 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang @HostListener('window:keydown.arrowRight', ['$event']) arrowRight(event: KeyboardEvent) { - if (this.focused) { - event.preventDefault(); + if (this.type === 'chips' && this.focused) { if (this.activeElement.getValue()) { + event.preventDefault(); let index = this.chips.toArray().indexOf(this.activeElement.getValue()); if (index < this.chips.length - 1) { this.activeElement.next(this.chips.get(index + 1)); @@ -544,20 +544,22 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang } this.subscriptions.push(this.formControl.valueChanges.subscribe(value => { if (this.formControl.enabled) { - value = (value === '') ? null : value; - if (this.type === 'logoURL') { - this.secure = (!value || value.includes('https://')); - } - if (this.initValue === value || (this.initValue === '' && value === null)) { - this.formControl.markAsPristine(); - } else { - this.formControl.markAsDirty(); - } - if (this.type === 'autocomplete_soft') { - this.filteredOptions = this.filter(value); - this.cdr.detectChanges(); - if (this.focused) { - this.open(true); + if(this.type !== 'year-range') { + value = (value === '') ? null : value; + if (this.type === 'logoURL') { + this.secure = (!value || value.includes('https://')); + } + if (this.initValue === value || (this.initValue === '' && value === null)) { + this.formControl.markAsPristine(); + } else { + this.formControl.markAsDirty(); + } + if (this.type === 'autocomplete_soft') { + this.filteredOptions = this.filter(value); + this.cdr.detectChanges(); + if (this.focused) { + this.open(true); + } } } if ((this.value && value && this.value !== value) || (!this.value && value) || this.value && !value) { @@ -566,14 +568,30 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang } })); if(this.formAsGroup) { - this.subscriptions.push(this.formAsGroup.get(this.yearRange.from.control).valueChanges.subscribe(value => { - if(this.formAsGroup.get(this.yearRange.from.control).valid) { - if(this.activeIndex === 0 && value.length > 0) { + let fromControl = this.formAsGroup.get(this.yearRange.from.control); + this.subscriptions.push(fromControl.valueChanges.subscribe(value => { + let from = this.initValue[this.yearRange.from.control]; + if (from === value || (from === '' && value === null)) { + fromControl.markAsPristine(); + } else { + fromControl.markAsDirty(); + } + if(fromControl.valid) { + if(this.activeIndex === 0 && value) { this.activeIndex = 1; this.input.get(this.activeIndex).nativeElement.focus(); } } })); + let toControl = this.formAsGroup.get(this.yearRange.to.control); + this.subscriptions.push(toControl.valueChanges.subscribe(value => { + let to = this.initValue[this.yearRange.to.control]; + if (to === value || (to === '' && value === null)) { + toControl.markAsPristine(); + } else { + toControl.markAsDirty(); + } + })); } if (this.input) { this.input.forEach(input => {