[Monitor & Library | develop]: [Bug fix] Show quick contact button when not in contacts us and not intersecting either with contact us section (home page), nor with bottom.

1. layout.service.ts: Initialize hasQuickContactSubject to false (Don't ever show it unless it should be there).
2. quick-contact.service.ts: Initialize display to false (Assume it is intersecting, until it is proved it is not).
3. app.component.ts: Updated checks for <quick-contact> and added public bottomNotIntersecting: boolean; and public displayQuickContact: boolean;
This commit is contained in:
Konstantina Galouni 2023-05-08 17:50:39 +03:00
parent 2db3855cbb
commit 23131ac2fd
2 changed files with 17 additions and 17 deletions

View File

@ -60,7 +60,8 @@ import {ResourcesService} from "./openaireLibrary/monitor/services/resources.ser
</cookie-law>
<bottom #bottom *ngIf="properties && showMenu" id="bottom" [grantAdvance]="false"
[properties]="properties"></bottom>
<quick-contact #quickContact *ngIf="showQuickContact && contactForm" (sendEmitter)="send($event)"
<quick-contact #quickContact *ngIf="bottomNotIntersecting && displayQuickContact && contactForm"
(sendEmitter)="send($event)"
[contactForm]="contactForm" [sending]="sending" [images]="images" [contact]="'Help'"
[organizationTypes]="organizationTypes"
class="uk-visible@m"></quick-contact>
@ -79,7 +80,8 @@ export class AppComponent {
header: Header;
logoPath: string = 'assets/common-assets/logo-services/monitor/';
/* Contact */
public showQuickContact: boolean;
public bottomNotIntersecting: boolean;
public displayQuickContact: boolean; // intersecting with specific section in home page
public showGetStarted: boolean = true;
public contactForm: UntypedFormGroup;
public organizationTypes: string[] = [
@ -107,7 +109,7 @@ export class AppComponent {
if (event instanceof NavigationEnd) {
if (event.url === '/contact-us') {
this.quickContactService.setDisplay(false);
} else if (event.url !== '/contact-us' && !this.showQuickContact) {
} else if (event.url !== '/contact-us' && (!this.bottomNotIntersecting || !this.displayQuickContact)) {
this.quickContactService.setDisplay(true);
}
this.showGetStarted = event.url !== '/get-started';
@ -135,7 +137,7 @@ export class AppComponent {
this.reset();
}));
this.subscriptions.push(this.quickContactService.isDisplayed.subscribe(display => {
this.showQuickContact = display;
this.displayQuickContact = display;
}));
}
@ -145,25 +147,23 @@ export class AppComponent {
rootMargin: '0px',
threshold: 0.1
};
let intersectionObserver = new IntersectionObserver(entries => {
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);
}
let intersectionObserver = new IntersectionObserver(entries => {
entries.forEach(entry => {
// if (entry.isIntersecting && this.showQuickContact) {
this.bottomNotIntersecting = !entry.isIntersecting;
});
}, options);
intersectionObserver.observe(this.bottom.nativeElement);
this.subscriptions.push(intersectionObserver);
}, options);
intersectionObserver.observe(this.bottom.nativeElement);
this.subscriptions.push(intersectionObserver);
}
public ngOnDestroy() {
this.subscriptions.forEach(value => {
if (value instanceof Subscriber) {
value.unsubscribe();
} else if (value instanceof IntersectionObserver) {
value.disconnect();
}
});
this.userManagementService.clearSubscriptions();

@ -1 +1 @@
Subproject commit bd87a47795f8f9243e0a1129d715fcb96cf9b714
Subproject commit d6ec928237238cf1d0bebbf2a83e915348b8e38a