diff --git a/src/app/app.module.ts b/src/app/app.module.ts index be39d339e116fb2a4cf03099c6c8666ea24ace06..98aa012017e5bbee7e7bc954c489c4c7161efe85 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -34,6 +34,7 @@ import {SplitButtonModule} from 'primeng/splitbutton'; import {MenuModule} from 'primeng/menu'; import { AdminLeftMenuComponent } from './shared/admin-left-menu/admin-left-menu.component'; import {AccordionModule} from 'primeng/accordion'; +import { RecaptchaVisibilityService } from './service/recaptcha-visibility.service'; export function appConfigFactory(config: AppConfigService) { return function create() { @@ -98,6 +99,7 @@ export const jwtOptionsFactory = (appConfig: AppConfigService) => ({ providers: [ AuthGuard, AuthService, + RecaptchaVisibilityService, AppConfigService, provideZxvbnServiceForPSM(), { diff --git a/src/app/service/recaptcha-visibility.service.ts b/src/app/service/recaptcha-visibility.service.ts new file mode 100644 index 0000000000000000000000000000000000000000..7a29d3a8ff8d69e3b72ef379e7c4d799a6de2677 --- /dev/null +++ b/src/app/service/recaptcha-visibility.service.ts @@ -0,0 +1,18 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ providedIn: 'root' }) +export class RecaptchaVisibilityService { + showBadge(): void { + const badge = document.querySelector('.grecaptcha-badge') as HTMLElement; + if (badge) { + badge.style.visibility = 'visible'; + } + } + + hideBadge(): void { + const badge = document.querySelector('.grecaptcha-badge') as HTMLElement; + if (badge) { + badge.style.visibility = 'hidden'; + } + } +} diff --git a/src/app/shared/about/about.component.ts b/src/app/shared/about/about.component.ts index c458c63c2cbf6669c972af2381517fd75a009701..dc297fd738d3337c36c1946eda0e5c20bb0f3878 100644 --- a/src/app/shared/about/about.component.ts +++ b/src/app/shared/about/about.component.ts @@ -1,23 +1,30 @@ -import {Component, OnInit} from '@angular/core'; +import {Component, OnDestroy, OnInit} from '@angular/core'; import {AppConfigService, ChangelogService} from '../../service'; import {GitInfo} from '../../model/gitinfo'; +import { RecaptchaVisibilityService } from '../../service/recaptcha-visibility.service'; @Component({ selector: 'app-about', templateUrl: './about.component.html', styleUrls: ['./about.component.css'] }) -export class AboutComponent implements OnInit { +export class AboutComponent implements OnInit, OnDestroy { public gitInfo: GitInfo; constructor(private changelogService: ChangelogService, - private appConfigService: AppConfigService) { + private appConfigService: AppConfigService, + private readonly recaptcha: RecaptchaVisibilityService) { } ngOnInit() { + this.recaptcha.showBadge(); if (this.appConfigService.getShowGitInfo()) { this.changelogService.getGitInfo().subscribe(info => this.gitInfo = info); } } + + ngOnDestroy(): void { + this.recaptcha.hideBadge(); + } } diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index 20ffb98d661d7af399933fb60a6111bbcaf9bf74..167728209e92bacbd66f831a2f55b99259d32bf6 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -72,6 +72,7 @@ import { BrowserModule } from '@angular/platform-browser'; import {ChartModule} from 'primeng/chart'; import { RolesExcludedDirective } from '../directive/roles-exluded.directive'; import { FileUploadModule } from 'primeng/fileupload'; +import { RecaptchaVisibilityService } from '../service/recaptcha-visibility.service'; @@ -155,6 +156,7 @@ import { FileUploadModule } from 'primeng/fileupload'; PasswordValidator, UserDataService, NotificationService, + RecaptchaVisibilityService, AppConfigService, DatePipe, { diff --git a/src/app/welcome/welcome.component.ts b/src/app/welcome/welcome.component.ts index 6e8a863fd7e15aad123a0844796c5ecf508c537b..29d846e93716cd6e71a8cdcc0cd706b4bafbe2b1 100644 --- a/src/app/welcome/welcome.component.ts +++ b/src/app/welcome/welcome.component.ts @@ -1,14 +1,15 @@ import {AppConfigService} from '../service/appconfig.service'; -import {AfterContentChecked, AfterViewChecked, Component, OnInit,} from '@angular/core'; +import {AfterContentChecked, AfterViewChecked, Component, OnDestroy, OnInit,} from '@angular/core'; import {ActivatedRoute, Router} from '@angular/router'; import {ServiceUnavailableService} from '../service-unavailable/service-unavailable.service'; +import { RecaptchaVisibilityService } from '../service/recaptcha-visibility.service'; @Component({ selector: 'app-welcome', templateUrl: './welcome.component.html', styleUrls: ['./welcome.component.css'] }) -export class WelcomeComponent implements OnInit, AfterViewChecked, AfterContentChecked { +export class WelcomeComponent implements OnInit, AfterViewChecked, AfterContentChecked, OnDestroy { private height = 0; @@ -19,7 +20,8 @@ export class WelcomeComponent implements OnInit, AfterViewChecked, AfterContentC constructor(private appConfig: AppConfigService, public router: Router, private serviceHealth: ServiceUnavailableService, - private readonly route: ActivatedRoute) { + private readonly route: ActivatedRoute, + private readonly recaptcha: RecaptchaVisibilityService) { this.route.queryParams.subscribe(params => { console.log(params) if (params.logout !== undefined) { @@ -38,14 +40,21 @@ export class WelcomeComponent implements OnInit, AfterViewChecked, AfterContentC this.landingProfile = this.appConfig.getLandingProfile(); console.log("Landing profile = ", this.landingProfile) + this.recaptcha.showBadge(); } ngAfterContentChecked() { // this.onResize(); + this.recaptcha.showBadge(); } ngAfterViewChecked() { // this.onResize(); + this.recaptcha.showBadge(); + } + + ngOnDestroy(): void { + this.recaptcha.hideBadge(); } public onCloseBanner() { diff --git a/src/styles.css b/src/styles.css index b467c8f239634fbb7639cfd5035144c2ca746c71..908c0bd320579e9adddb50a1417859bbe91a9add 100644 --- a/src/styles.css +++ b/src/styles.css @@ -240,3 +240,8 @@ body .p-datatable .p-sortable-column.p-highlight{ body .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon{ color:var(--primary-button-color); } + +.grecaptcha-badge { + visibility: hidden; + bottom: 45px !important; +} \ No newline at end of file