From f0388a85788007e4a3eaed7e185a12291fb834ec Mon Sep 17 00:00:00 2001 From: Alex Martzios Date: Tue, 22 Feb 2022 16:40:33 +0200 Subject: [PATCH] add quick-contact component on the app --- src/app/app.component.ts | 10 ++++++- src/app/app.module.ts | 2 ++ src/app/home/home.component.html | 2 +- src/app/home/home.component.ts | 50 ++++++++++++++++++++++++++++---- src/app/openaireLibrary | 2 +- 5 files changed, 58 insertions(+), 8 deletions(-) diff --git a/src/app/app.component.ts b/src/app/app.component.ts index fb5abb1..d8dfee1 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -10,7 +10,9 @@ import {properties} from "../environments/environment"; import {BehaviorSubject, Subscriber} from "rxjs"; import {StakeholderService} from "./openaireLibrary/monitor/services/stakeholder.service"; import {Header} from "./openaireLibrary/sharedComponents/navigationBar.component"; +import {QuickContactComponent} from "./openaireLibrary/sharedComponents/quick-contact/quick-contact.component"; import {SmoothScroll} from "./openaireLibrary/utils/smooth-scroll"; +import {QuickContactService} from './openaireLibrary/sharedComponents/quick-contact/quick-contact.service'; @Component({ selector: 'app-root', @@ -43,6 +45,7 @@ import {SmoothScroll} from "./openaireLibrary/utils/smooth-scroll"; + ` @@ -58,11 +61,13 @@ export class AppComponent { url: string; header: Header; logoPath: string = 'assets/common-assets/'; + public showQuickContact: boolean; private subscriptions: any[] = []; constructor(private route: ActivatedRoute, private propertiesService: EnvironmentSpecificService, private router: Router, private stakeholderService: StakeholderService, private smoothScroll: SmoothScroll, - private userManagementService: UserManagementService) { + private userManagementService: UserManagementService, + private quickContactService: QuickContactService) { this.subscriptions.push(router.events.forEach((event) => { if (event instanceof NavigationEnd) { this.url = event.url; @@ -92,6 +97,9 @@ export class AppComponent { }; this.buildMenu(); })); + this.subscriptions.push(this.quickContactService.isDisplayed.subscribe(display => { + this.showQuickContact = display; + })); } public ngOnDestroy() { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3f884ce..29cfd75 100755 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -12,6 +12,7 @@ import {CookieLawModule} from './openaireLibrary/sharedComponents/cookie-law/coo import {BottomModule} from './openaireLibrary/sharedComponents/bottom.module'; import {ErrorModule} from './openaireLibrary/error/error.module'; import {NavigationBarModule} from './openaireLibrary/sharedComponents/navigationBar.module'; +import {QuickContactModule} from './openaireLibrary/sharedComponents/quick-contact/quick-contact.module'; import {DEFAULT_TIMEOUT, TimeoutInterceptor} from "./openaireLibrary/timeout-interceptor.service"; import {Schema2jsonldModule} from "./openaireLibrary/sharedComponents/schema2jsonld/schema2jsonld.module"; import {HttpInterceptorService} from "./openaireLibrary/http-interceptor.service"; @@ -28,6 +29,7 @@ import {SharedModule} from "./openaireLibrary/shared/shared.module"; ErrorModule, FormsModule, NavigationBarModule, + QuickContactModule, BottomModule, CookieLawModule, BrowserTransferStateModule, diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 406b30b..34f8822 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -230,7 +230,7 @@ -
+

Need more information?
Get in touch and let us help you.

diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 1d85367..b3e0244 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -1,4 +1,4 @@ -import {Component, ViewChild} from '@angular/core'; +import {Component, ViewChild, OnDestroy, AfterViewInit} from '@angular/core'; import {ActivatedRoute, Router} from '@angular/router'; import {Meta, Title} from '@angular/platform-browser'; import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties'; @@ -18,13 +18,14 @@ import {User} from "../openaireLibrary/login/utils/helper.class"; import {UserManagementService} from "../openaireLibrary/services/user-management.service"; import {properties} from "../../environments/environment"; import {Subscriber} from "rxjs"; +import {QuickContactService} from '../openaireLibrary/sharedComponents/quick-contact/quick-contact.service'; @Component({ selector: 'home', templateUrl: 'home.component.html', styleUrls: ['home.component.css'] }) -export class HomeComponent { +export class HomeComponent implements OnDestroy, AfterViewInit { public pageTitle = "OpenAIRE | Monitor"; public description = "OpenAIRE - Monitor, A new era of monitoring research. Open data. Open methodologies. Work together with us to view, understand and visualize research statistics and indicators."; public stakeholders: StakeholderInfo[] = []; @@ -51,11 +52,13 @@ export class HomeComponent { public softwareSize: any = null; public otherSize: any = null; public fundersSize: any = null; + public showQuickContact: boolean = true; @ViewChild('AlertModal') modal; private errorMessages: ErrorMessagesComponent; private subscriptions = []; private user: User; - + private observer: IntersectionObserver = null; + constructor( private route: ActivatedRoute, private _router: Router, @@ -67,7 +70,9 @@ export class HomeComponent { private userManagementService: UserManagementService, private helper: HelperService, private seoService: SEOService, - private _refineFieldResultsService: RefineFieldResultsService, private _searchResearchResultsService: SearchResearchResultsService) { + private _refineFieldResultsService: RefineFieldResultsService, + private _searchResearchResultsService: SearchResearchResultsService, + private quickContactService: QuickContactService) { 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'"); @@ -93,7 +98,42 @@ export class HomeComponent { this.getStakeholders(); })); } - + + OnDestroy() { + if (this.observer) { + this.observer.disconnect(); + } + } + + ngAfterViewInit() { + if (typeof document !== "undefined") { + this.createObserver(); + } + } + + createObserver() { + let target = document.querySelector('#last-section'); + let options = { + root: null, + rootMargin: '200px', + threshold: 1.0 + }; + this.observer = new IntersectionObserver(entries => { + console.log(entries); + console.log(this.showQuickContact); + entries.forEach(entry => { + if(entry.isIntersecting && this.showQuickContact) { + this.showQuickContact = false; + this.quickContactService.setDisplay(this.showQuickContact); + } else if(!entry.isIntersecting && !this.showQuickContact) { + this.showQuickContact = true; + this.quickContactService.setDisplay(this.showQuickContact); + } + }) + }, options); + this.observer.observe(target); + } + private getPageContents() { this.subscriptions.push(this.helper.getPageHelpContents(this.properties, 'monitor', this._router.url).subscribe(contents => { this.pageContents = contents; diff --git a/src/app/openaireLibrary b/src/app/openaireLibrary index 94519de..f3ff37c 160000 --- a/src/app/openaireLibrary +++ b/src/app/openaireLibrary @@ -1 +1 @@ -Subproject commit 94519de68b284f1ef4014d0eaebf02ea9ba819d6 +Subproject commit f3ff37c74cf06a703b31927ee9322cc65917dcf0