diff --git a/src/app/about/faqs.component.html b/src/app/about/faqs.component.html index d779963..d5634e7 100644 --- a/src/app/about/faqs.component.html +++ b/src/app/about/faqs.component.html @@ -1,12 +1,25 @@ -
-
-
- -
-
-

Frequently Asked
Questions.

-
-
+
+
+
+
+ +
+
+

Frequently Asked
Questions.

+
+
+
+ +
+
+
+
+
+

Frequently Asked
Questions.

+
+
+
+
- diff --git a/src/app/about/how-it-works.component.ts b/src/app/about/how-it-works.component.ts index d80dbd6..a436835 100644 --- a/src/app/about/how-it-works.component.ts +++ b/src/app/about/how-it-works.component.ts @@ -13,304 +13,576 @@ import {StakeholderEntities} from "../openaireLibrary/monitor/entities/stakehold @Component({ selector: 'how-it-works', template: ` -
-
-
-
- -
-
-

How it works.

-
- Join the OpenAIRE Monitor service and we will create for you a dashboard to track, understand and - position your organization's research activities and their impact, discover and evaluate Open Science - trends for your organization and make data-driven decisions. Here's how it works. -
-
- Get Started -
-
-
-
-
- -
-
-
-
-
- - - -
-
-
-
-
- - - -
-
- -
+
+
+
+
+
+ +
+
+

How it works.

+
+ Join the OpenAIRE Monitor service and we will create for you a dashboard to track, understand and + position your organization's research activities and their impact, discover and evaluate Open Science + trends for your organization and make data-driven decisions. Here's how it works. +
+
+ Get Started +
+
+
+
+
+ +
+
+
+
+
+ + + +
+
+
+
    +
  • + + +
    +
    + Step 1a +

    You provide Information about your funded projects and + join OpenAIRE.

    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    + +
    +
    + Step 2a +

    You validate the results and approve for them to be shown + on the Explore portal.

    +

    Examine your dashboard and the showcased information to ensure you are satisfied with what you + see.

    +
    +
    + Step 3a +

    Through 1-on-1 expert consultations you interact with + us

    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    +
    + Step 4a +

    Customise your dashboard and make your own profile.

    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    + +
    +
    + Step 5a +

    Select your team

    +

    And make them collaborators of the service.

    +
    +     + +
    +
    + Step 1b +

    We ingest your project metadata and mine the OpenAIRE Research Graph. +

    +

    We infer links to research results: publications, datasets, software, etc.

    +
    + +
    +
    + Step 2b +

    We present the results to you on our Beta portal.

    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    + Step 3b +

    We produce well-documented visualisations of simple & more + advanced composite indicators.

    +

    Aligned with the Open Science principles and following an evidence-based approach, and based on the + funded research activities.

    +
    +
    + Step 4b +

    We refine until we are happy with the results.

    +

    We present your dashboard to you.

    +
    +
    + Step 5b +

    Notify you about new metrics and indicators

    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +     +     +
    • +
  • + + +
    +
    + Step 1a +

    You state your interest in having a research initiative + dashboard.

    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    + +
    +
    + Step 2a +

    You configure the criteria to identify the research + products that you want to be accounted for.

    +

    You use the administration dashboard we created for you. If this is not enough, you give us input for + the implementation of a customised full-text mining algorithm.

    +
    +
    + Step 3a +

    Through 1-on-1 expert consultations you interact with + us

    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    +
    + Step 4a +

    Customise your dashboard and make your own profile.

    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    + +
    +
    + Step 5a +

    Select your team

    +

    And make them collaborators of the service.

    +
    +     + +
    +
    + Step 1b +

    We set up an administration dashboard that you can use + to specify which research products of the OpenAIRE Research Graph are + relevant for you.

    +

    If needed, we develop a customized full-text mining algorithm to identify your publications.

    +
    + +
    +
    + Step 2b +

    We present the results to you on our Beta portal.

    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    + Step 3b +

    We produce well-documented visualisations of simple & more + advanced composite indicators.

    +

    Aligned with the Open Science principles and following an evidence-based approach.

    +
    +
    + Step 4b +

    We refine until we are happy with the results.

    +

    We present your dashboard to you.

    +
    +
    + Step 5b +

    Notify you about new metrics and indicators

    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +     +     +
    • +
  • + + + +
    +
    + Step 1a +

    You state your interest in having an institutional + dashboard for your institution.

    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    + +
    +
    + Step 2a +

    You validate and approve the results.

    +

    You examine your dashboard and the showcased information to ensure you are satisfied with what you + see.

    +
    +
    + Step 3a +

    Through 1-on-1 expert consultations you interact with + us

    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    +
    + Step 4a +

    Customise your dashboard and make your own profile.

    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    + +
    +
    + Step 5a +

    Select your team

    +

    And make them collaborators of the service.

    +
    +     + +
    +
    + Step 1b +

    Starting from the OpenAIRE + Research Graph we check for existing data for your institution.

    +

    We infer links to research results: publications, datasets, software, etc.

    +
    + +
    +
    + Step 2b +

    We present the results to you on our Beta portal.

    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    + Step 3b +

    We produce well-documented visualisations of simple & more + advanced composite indicators.

    +

    Aligned with the Open Science principles and following an evidence-based approach, and based on the + institution’s research activities.

    +
    +
    + Step 4b +

    We refine until we are happy with the results.

    +

    We present your dashboard to you.

    +
    +
    + Step 5b +

    Notify you about new metrics and indicators

    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +     +     +
    • +
+
+
+
+
+
+
+

How it works.

+
+ Join the OpenAIRE Monitor service and we will create for you a dashboard to track, understand and + position your organization's research activities and their impact, discover and evaluate Open Science + trends for your organization and make data-driven decisions. Here's how it works. +
+
+ Get Started +
+
+
+
+ +
+ +
+
+
+
+ + + +
+
+
+
    +
  • +
    + Are you a Funder? +
    +
    +
    + Step 1a +
    You provide Information about your funded projects and + join OpenAIRE.
    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    +
    + Step 1b +
    We ingest your project metadata and mine the OpenAIRE Research Graph. +
    +

    We infer links to research results: publications, datasets, software, etc.

    +
    +
    +
    +
    + Step 2a +
    You validate the results and approve for them to be shown + on the Explore portal.
    +

    Examine your dashboard and the showcased information to ensure you are satisfied with what you + see.

    +
    +
    + Step 2b +
    We present the results to you on our Beta portal.
    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    +
    +
    + Step 3a +
    Through 1-on-1 expert consultations you interact with + us
    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    + Step 3b +
    We produce well-documented visualisations of simple & more + advanced composite indicators.
    +

    Aligned with the Open Science principles and following an evidence-based approach, and based on the + funded research activities.

    +
    +
    +
    +
    + Step 4a +
    Customise your dashboard and make your own profile.
    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    +
    + Step 4b +
    We refine until we are happy with the results.
    +

    We present your dashboard to you.

    +
    +
    +
    +
    + Step 5a +
    Select your team
    +

    And make them collaborators of the service.

    +
    +
    + Step 5b +
    Notify you about new metrics and indicators
    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +
    +
    • +
  • +
    + Are you a Research Initiative? +
    +
    +
    + Step 1a +
    You state your interest in having a research initiative + dashboard.
    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    +
    + Step 1b +
    We set up an administration dashboard that you can use + to specify which research products of the OpenAIRE Research Graph are + relevant for you.
    +

    If needed, we develop a customized full-text mining algorithm to identify your publications.

    +
    +
    +
    +
    + Step 2a +
    You configure the criteria to identify the research + products that you want to be accounted for.
    +

    You use the administration dashboard we created for you. If this is not enough, you give us input for + the implementation of a customised full-text mining algorithm.

    +
    +
    + Step 2b +
    We present the results to you on our Beta portal.
    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    +
    +
    + Step 3a +
    Through 1-on-1 expert consultations you interact with + us
    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    + Step 3b +
    We produce well-documented visualisations of simple & more + advanced composite indicators.
    +

    Aligned with the Open Science principles and following an evidence-based approach, and based on the + institution’s research activities.

    +
    +
    +
    +
    + Step 4a +
    Customise your dashboard and make your own profile.
    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    +
    + Step 4b +
    We refine until we are happy with the results.
    +

    We present your dashboard to you.

    +
    +
    +
    +
    + Step 5a +
    Select your team
    +

    And make them collaborators of the service.

    +
    +
    + Step 5b +
    Notify you about new metrics and indicators
    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +
    +
    • +
  • +
    + Are you a Research Institution? +
    +
    +
    + Step 1a +
    You state your interest in having an institutional + dashboard for your institution.
    +

    All information is exchanged under confidential agreements and we only make public what you agree + on.

    +
    +
    + Step 1b +
    Starting from the OpenAIRE + Research Graph we check for existing data for your institution.
    +

    We infer links to research results: publications, datasets, software, etc.

    +
    +
    +
    +
    + Step 2a +
    You validate and approve the results.
    +

    You examine your dashboard and the showcased information to ensure you are satisfied with what you + see.

    +
    +
    + Step 2b +
    We present the results to you on our Beta portal.
    +

    We refine until you are happy with the results. We allocate the hardware resources needed to create + your dashboard.

    +
    +
    +
    +
    + Step 3a +
    Through 1-on-1 expert consultations you interact with + us
    +
      +
    • to understand any gaps and deviations within the dashboard
      • +
    • to verify the data integrity
      • +
    • to discuss the addition of any new metrics and indicators that might interest you
      • +
    +
    +
    + Step 3b +
    We produce well-documented visualisations of simple & more + advanced composite indicators.
    +

    Aligned with the Open Science principles and following an evidence-based approach, and based on the + institution’s research activities.

    +
    +
    +
    +
    + Step 4a +
    Customise your dashboard and make your own profile.
    +

    Select the metrics of + interest to you and the ones you want to publish, to keep private, or to share just with colleagues. +

    +
    +
    + Step 4b +
    We refine until we are happy with the results.
    +

    We present your dashboard to you.

    +
    +
    +
    +
    + Step 5a +
    Select your team
    +

    And make them collaborators of the service.

    +
    +
    + Step 5b +
    Notify you about new metrics and indicators
    +

    as we keep enriching the Graph, which you may find useful and add to your profile

    +
    +
    +
    • +
+
+
+
`, styles: [` .custom-translate-bottom-left { diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 802b69e..2d25307 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,7 +1,6 @@ import {NgModule} from '@angular/core'; import {RouterModule, Routes} from '@angular/router'; import {OpenaireErrorPageComponent} from './error/errorPage.component'; -import {isDevelopmentGuard} from './openaireLibrary/error/isDevelopmentGuard.guard'; const routes: Routes = [ {path: '', loadChildren: () => import('./home/home.module').then(m => m.HomeModule)}, diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 4ff3da3..b66ef22 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -30,11 +30,9 @@ import {ResourcesService} from "./openaireLibrary/monitor/services/resources.ser - +
+ Get Started +
Get Started + [organizationTypes]="organizationTypes" + class="uk-visible@m">
` @@ -189,6 +188,9 @@ export class AppComponent { new MenuItem("", "Blog", "https://blogs.openaire.eu/", "", false, [], [], {}), new MenuItem("", "Contact us", "https://beta.openaire.eu/contact-us", "", false, [], [], {}) ]; + this.menuItems.push( + new MenuItem("contact-us", "Contact us", "", "/contact-us", false, [], null, {}, null, null, "uk-hidden@m") + ); this.showMenu = true; if(typeof document !== 'undefined') { setTimeout(() => { diff --git a/src/app/contact/contact.component.html b/src/app/contact/contact.component.html index 0a63402..db8db61 100644 --- a/src/app/contact/contact.component.html +++ b/src/app/contact/contact.component.html @@ -1,6 +1,6 @@
-
+
@@ -10,7 +10,10 @@
-

+

+ Contact us. +

+

Contact us.

diff --git a/src/app/get-started/get-started.component.html b/src/app/get-started/get-started.component.html index a1fb5d5..c19e56d 100644 --- a/src/app/get-started/get-started.component.html +++ b/src/app/get-started/get-started.component.html @@ -1,66 +1,119 @@ -
-
- -
-
-
-
-

Get started with
OpenAIRE Monitor Dashboard .

-
- The OpenAIRE Monitor Dashboard is an open tracking platform with all the tools you need - to understand and make insightful decisions — whether you are a funder, a research initiative - or a community, and want to measure or increase uptake - of Open Science, understand your costs, gaps and strengths, or build a community around it. +
+
+
+
-
-
-
- Step 1 -
- - Provide some
information -
+
+
+

Get started with
OpenAIRE Monitor Dashboard .

+
+ The OpenAIRE Monitor Dashboard is an open tracking platform with all the tools you need + to understand and make insightful decisions — whether you are a funder, a research initiative + or a community, and want to measure or increase uptake + of Open Science, understand your costs, gaps and strengths, or build a community around it.
-
- Step 2 -
- - We contact
you +
+
+
+
+ Step 1 +
+ + Provide some
information +
+
+
+ Step 2 +
+ + We contact
you +
-
-
-
-

Provide some information.

-
-
- - +
+
+

Provide some information.

+
+
+ + +
+
+
+
+
+
+
+
+

Need more information?
View details on the process.

+ + + Learn More + + +
+
+
+
-
-
-
-
-

Need more information?
View details on the process.

- +
+
+
+

Get started with
OpenAIRE Monitor Dashboard.

+
+ The OpenAIRE Monitor Dashboard is an open tracking platform with all the tools you need + to understand and make insightful decisions — whether you are a funder, a research initiative + or a community, and want to measure or increase uptake + of Open Science, understand your costs, gaps and strengths, or build a community around it. +
+
+
+
+ Step 1 + + Provide some
information +
+
+ Step 2 + + We contact you +
+
+
+
+
+

Provide some information.

+
+
+ + +
+
+
+
+
+
+

Need more information?
View details on the process.

+ Learn More - -
-
-
+
diff --git a/src/app/get-started/get-started.component.less b/src/app/get-started/get-started.component.less new file mode 100644 index 0000000..5dbd086 --- /dev/null +++ b/src/app/get-started/get-started.component.less @@ -0,0 +1,14 @@ +.number-step { + height: 70px; + opacity: 0.1; + top: 50%; + transform: translateY(-50%) rotate(20deg); +} + +.number-step-1 { + right: 10%; +} + +.number-step-2 { + left: 10%; +} \ No newline at end of file diff --git a/src/app/get-started/get-started.component.ts b/src/app/get-started/get-started.component.ts index f0836c1..855fe27 100644 --- a/src/app/get-started/get-started.component.ts +++ b/src/app/get-started/get-started.component.ts @@ -17,7 +17,8 @@ import {StakeholderEntities} from '../openaireLibrary/monitor/entities/stakehold @Component({ selector: 'get-started', - templateUrl: './get-started.component.html' + templateUrl: './get-started.component.html', + styleUrls: ['./get-started.component.less'] }) export class GetStartedComponent implements OnInit { public url: string = null; diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index b6ade76..464099f 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -1,4 +1,24 @@ -
+ +
+

+ Monitor, discover and understand. +

+

Track your organization’s research output in a comprehensive manner. Identify research pathways across key dimensions with granular and timely indicators.

+
+
+

+ Enhance open science uptake. +

+

Work with the Open Science expert community for open and transparent metrics. Discover Open Science costs and trends for your organization. See how you fare in the European Open Science Cloud.

+
+
+

+ Turn data into actionable insights. +

+

See what works and what not, reveal hidden potential. Measure research impact, discover trends, connections and collaborations to improve and optimize your future actions.

+
+ +
@@ -15,7 +35,7 @@ Get Started
-
+
@@ -24,73 +44,33 @@
- - -
-

- Monitor, discover and understand. -

-

Track your organization’s research output in a comprehensive manner. Identify research pathways across key dimensions with granular and timely indicators.

-
-
-

- Enhance open science uptake. -

-

Work with the Open Science expert community for open and transparent metrics. Discover Open Science costs and trends for your organization. See how you fare in the European Open Science Cloud.

-
-
-

- Turn data into actionable insights. -

-

See what works and what not, reveal hidden potential. Measure research impact, discover trends, connections and collaborations to improve and optimize your future actions.

-
-
Funders. Research Institutions. Research Initiatives.

Simplify research monitoring & evaluation.

-
-
-
+
+
+
-
-
+
+
ipad - - - - - -
-
-
- +
+
+
- -
-
-
-
- ipad -
-
-
- -
-
-
@@ -109,15 +89,14 @@
-
+
+ [href]="url" target="_blank" uk-scrollspy-class>
-
{{(numberSize.number|number) + numberSize.size}}
-
{{name}}
+
{{(numberSize.number|number) + numberSize.size}}
+
{{name}}
 @@ -157,7 +136,7 @@

Openness. Usability. Replicability. Trust.

Learn and work with a thriving community behind you.
+ routerLinkActive="router-link-active" routerLink="/about/learn-how"> Learn More @@ -226,7 +205,7 @@
+ routerLinkActive="router-link-active" routerLink="/browse"> Browse @@ -236,12 +215,14 @@
- +
+ + + + + + +
  • @@ -291,14 +272,294 @@

- Need more information or a demo? Get in touch and let us show you in practice how you can apply OpenAIRE Monitor to your needs. + Need more information or a demo? Get in touch and let us show you in practice how you can apply OpenAIRE Monitor to your needs.

Contact us
+ routerLink="/contact-us">Contact us
- +
+
+
+
+
+
+

+ A new era of monitoring research. +

+
+
Discover, track and understand trends and impact pathways for your organization.
+
Make informed decisions.
+
+
+
+
+ + + +
+
+
+
+
+ Funders. Research Institutions. Research Initiatives. +

Simplify research monitoring & evaluation.

+
+
+
+
+
+
+
+ ipad +
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+ ipad +
+
+ +
+
+
+
+
+
+
+
+ OpenAIRE Graph + OpenAIRE Graph +
+
+

+ Tap into the OpenAIRE Research Graph. +

+
+ The OpenAIRE Research Graph is one of the largest open scholarly record collections + worldwide, key in fostering Open Science and establishing its practices in the daily + research activities. Conceived as a public and transparent good, populated out of data + sources trusted by scientists, the Graph aims at bringing discovery, monitoring, and + assessment of science back in the hands of the scientific community. +
+
+
+
+ OpenAIRE Graph +
+
+ + +
+
+
{{(numberSize.number|number) + numberSize.size}}
+
{{name}}
+
+
+ + +
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+
+
+
+
+
+

Openness.

+

Usability.

+

Replicability.

+

Trust.

+
Learn and work with a thriving community behind you.
+ + + Learn More + + +
+
+
+
+
+ +
+
Comprehensive outlook
+
+ Monitor is built on the OpenAIRE Research + Graph. A global linked research graph, a shared data resource from open initiatives around the world. Our indicators cover a wide range of themes from input to impact. +
+
+
+
+ +
+
Showcasing, monitoring, analysis
+
+ Customize your dashboard by choosing from a variety of pre-defined metrics and select which ones to show publicly, which to invited team members, and which are still work in progress (private).
+
+
+
+ +
+
Transparent methodology
+
+ We base our service on Open Science principles. We rely on open data sources, and document our algorithms for every metric and indicator we publish. +
+
+
+
+ +
+
Minimum effort to join
+
+ You only share some information with us to include in our backend aggregating and data mining, and we deliver a view of your world. +
+
+
+
+ +
+
Tailor-made monitoring, responsive to your needs
+
+ Our experts work with you on demand in one-on-one sessions to provide additional indicators and curate your data.
+
+
+
+
+
+
+
+

{{stakeholderEntities.STAKEHOLDERS}} in action.

+
+ View existing {{stakeholderEntities.STAKEHOLDERS | lowercase}} from collaborating organizations. Get a preview on how they work and how our service can be customized to serve you. +
+
+ + + Browse + + +
+
+
+ +
+ +
+ + + + + + +
+
    +
  • +
    +
    +
    + +
    +
    +
    +
    • +
  • +
    +
    +
    + +
    +
    +
    +
    • +
  • +
    +
    +
    + +
    +
    +
    +
    • +
  • +
    +
    +
    + +
    +
    +
    +
    • +
+ +
+
+
+

+ Need more information or a demo? +

+
+ Get in touch and let us show you in practice how you can apply OpenAIRE Monitor to your needs. +
+ Contact us + + +
diff --git a/src/app/home/home.component.less b/src/app/home/home.component.less index 726bda7..9f2d7f4 100644 --- a/src/app/home/home.component.less +++ b/src/app/home/home.component.less @@ -50,4 +50,21 @@ transform: matrix(1, 0.07, -0.07, 1, 0, 0); } + .contact-image { + position: absolute; + width: 66px; + height: 82px; + object-fit: cover; + border-radius: 18px; + transform: matrix(1, 0.07, -0.07, 1, 0, 0); + &.contact-image-left { + top: 0; + right: 15%; + } + &.contact-image-right { + bottom: 50%; + right: 2%; + } + } + } diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index d232da1..b3b0dff 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,9 +1,12 @@ import { AfterViewInit, + ChangeDetectorRef, Component, ElementRef, + Inject, OnDestroy, OnInit, + PLATFORM_ID, QueryList, ViewChild, ViewChildren @@ -12,7 +15,6 @@ import {ActivatedRoute, Router} from '@angular/router'; import {Meta, Title} from '@angular/platform-browser'; import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties'; import {PiwikService} from '../openaireLibrary/utils/piwik/piwik.service'; - import {ErrorCodes} from '../openaireLibrary/utils/properties/errorCodes'; import {ErrorMessagesComponent} from '../openaireLibrary/utils/errorMessages.component'; import {HelperService} from "../openaireLibrary/utils/helper/helper.service"; @@ -30,6 +32,8 @@ import {Subscriber} from "rxjs"; import {QuickContactService} from '../openaireLibrary/sharedComponents/quick-contact/quick-contact.service'; import {IDeactivateComponent} from "../openaireLibrary/utils/can-exit.guard"; import {OpenaireEntities} from "../openaireLibrary/utils/properties/searchFields"; +import {isPlatformServer} from '@angular/common'; +import {LayoutService} from '../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service'; @Component({ selector: 'home', @@ -66,9 +70,12 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv @ViewChild('AlertModal') modal; private errorMessages: ErrorMessagesComponent; private subscriptions = []; + private mutationObserver: MutationObserver; private user: User; @ViewChildren('scrolling_element') elements: QueryList; @ViewChild('contact') contact: ElementRef; + isMobile: boolean = false; + isServer: boolean; constructor( private route: ActivatedRoute, @@ -83,7 +90,10 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv private seoService: SEOService, private _refineFieldResultsService: RefineFieldResultsService, private _searchResearchResultsService: SearchResearchResultsService, - private quickContactService: QuickContactService) { + private quickContactService: QuickContactService, + private layoutService: LayoutService, + private cdr: ChangeDetectorRef, + @Inject(PLATFORM_ID) private platform: any) { this._meta.updateTag({content: this.description}, "name='description'"); this._meta.updateTag({content: this.description}, "property='og:description'"); this._meta.updateTag({content: this.pageTitle}, "property='og:title'"); @@ -91,6 +101,7 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv this.errorCodes = new ErrorCodes(); this.errorMessages = new ErrorMessagesComponent(); this.status = this.errorCodes.LOADING; + this.isServer = isPlatformServer(this.platform); } public ngOnInit() { @@ -108,6 +119,10 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv this.user = user; this.getStakeholders(); })); + this.layoutService.isMobile.subscribe(isMobile => { + this.isMobile = isMobile; + this.cdr.detectChanges(); + }); } canExit(): boolean { @@ -127,6 +142,9 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv value.disconnect(); } }); + if(this.mutationObserver) { + this.mutationObserver.disconnect(); + } } ngAfterViewInit() { @@ -152,8 +170,10 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv } }); }, options); - intersectionObserver.observe(this.contact.nativeElement); - let mutationObserver = new MutationObserver(entries => { + if(this.contact) { + intersectionObserver.observe(this.contact.nativeElement); + } + this.mutationObserver = new MutationObserver(entries => { entries.forEach(entry => { if (entry.attributeName === 'style') { let opacities: number[] = this.elements.map(element => +element.nativeElement.style.opacity); @@ -168,11 +188,12 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit, IDeactiv } }) }); - this.elements.forEach(element => { - mutationObserver.observe(element.nativeElement, {attributes: true}); + this.elements.changes.subscribe(() => { + this.elements.forEach(element => { + this.mutationObserver.observe(element.nativeElement, {attributes: true}); + }); }); this.subscriptions.push(intersectionObserver); - this.subscriptions.push(mutationObserver); } private getPageContents() { diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 72d9bda..60d64f6 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -2,11 +2,8 @@ import {NgModule} from '@angular/core'; import {CommonModule} from '@angular/common'; import {FormsModule} from '@angular/forms'; import {RouterModule} from '@angular/router'; - import {HomeComponent} from './home.component'; - import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard'; - import {PiwikService} from '../openaireLibrary/utils/piwik/piwik.service'; import {ErrorMessagesModule} from '../openaireLibrary/utils/errorMessages.module'; import {HelperModule} from "../openaireLibrary/utils/helper/helper.module"; @@ -23,12 +20,14 @@ import {LogoUrlPipeModule} from "../openaireLibrary/utils/pipes/logoUrlPipe.modu import {SectionScrollModule} from '../openaireLibrary/utils/section-scroll/section-scroll.module'; import {LoadingModule} from "../openaireLibrary/utils/loading/loading.module"; import {BrowseStakeholderModule} from "../browse-stakeholder/browse-stakeholder.module"; +import {SliderTabsModule} from '../openaireLibrary/sharedComponents/tabs/slider-tabs.module'; @NgModule({ imports: [ CommonModule, FormsModule, RouterModule, ErrorMessagesModule, OtherPortalsModule, HelperModule, Schema2jsonldModule, SEOServiceModule, HomeRoutingModule, SearchResearchResultsServiceModule, - RefineFieldResultsServiceModule, AlertModalModule, IconsModule, UrlPrefixModule, LogoUrlPipeModule, SectionScrollModule, LoadingModule, BrowseStakeholderModule + RefineFieldResultsServiceModule, AlertModalModule, IconsModule, UrlPrefixModule, LogoUrlPipeModule, + SectionScrollModule, LoadingModule, BrowseStakeholderModule, SliderTabsModule ], declarations: [ HomeComponent diff --git a/src/app/openaireLibrary b/src/app/openaireLibrary index 10b3861..5bcc25f 160000 --- a/src/app/openaireLibrary +++ b/src/app/openaireLibrary @@ -1 +1 @@ -Subproject commit 10b386179c34b3e33e4466b17a9622c7c81e67fc +Subproject commit 5bcc25fe849d87d8570d7ec7ebe6650642ef1de2 diff --git a/src/app/search-stakeholders/search-stakeholders.component.ts b/src/app/search-stakeholders/search-stakeholders.component.ts index ee11eb3..5a3161a 100644 --- a/src/app/search-stakeholders/search-stakeholders.component.ts +++ b/src/app/search-stakeholders/search-stakeholders.component.ts @@ -1,4 +1,4 @@ -import {Component, ViewChild} from "@angular/core"; +import {ChangeDetectorRef, Component, ViewChild} from "@angular/core"; import {SearchUtilsClass} from "../openaireLibrary/searchPages/searchUtils/searchUtils.class"; import {ErrorMessagesComponent} from "../openaireLibrary/utils/errorMessages.component"; import {ErrorCodes} from "../openaireLibrary/utils/properties/errorCodes"; @@ -16,13 +16,14 @@ import {properties} from "../../environments/environment"; import {Subscriber} from "rxjs"; import {Breadcrumb} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.component"; import {TitleCasePipe} from "@angular/common"; +import {LayoutService} from "../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service"; @Component({ selector: 'search-stakeholders', template: ` { + this.isMobile = isMobile; + this.cdr.detectChanges(); + }) } ngOnDestroy() { diff --git a/src/assets/common-assets b/src/assets/common-assets index 2477972..95c2b50 160000 --- a/src/assets/common-assets +++ b/src/assets/common-assets @@ -1 +1 @@ -Subproject commit 24779729b6f6bd4f099ed5645786b6452120d3d6 +Subproject commit 95c2b50a57696a80dd3dd376880f26cb21d65817 diff --git a/src/assets/monitor-assets/home/ipad-mobile.png b/src/assets/monitor-assets/home/ipad-mobile.png new file mode 100644 index 0000000..be08ed3 Binary files /dev/null and b/src/assets/monitor-assets/home/ipad-mobile.png differ diff --git a/src/assets/monitor-assets/home/ipad-tablet.png b/src/assets/monitor-assets/home/ipad-tablet.png new file mode 100644 index 0000000..eb5323c Binary files /dev/null and b/src/assets/monitor-assets/home/ipad-tablet.png differ diff --git a/src/assets/openaire-theme b/src/assets/openaire-theme index a9acdff..c4e2781 160000 --- a/src/assets/openaire-theme +++ b/src/assets/openaire-theme @@ -1 +1 @@ -Subproject commit a9acdff7b3249794e002bffff52c07babc3d9d06 +Subproject commit c4e2781acc42f281265a70d6cd75616cdd6fa762