From 64e0f8cf12c804a7a2fa582fd954f686cea9a45b Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Tue, 16 Jun 2020 09:56:24 +0200 Subject: [PATCH] Fix scrolling with hash in url --- .../app/+about/about-instance/about-instance.component.ts | 8 +++++++- .../app/+about/about-peertube/about-peertube.component.ts | 8 +++++++- .../my-account-settings/my-account-settings.component.ts | 8 +++++++- client/src/app/app.component.ts | 1 + 4 files changed, 22 insertions(+), 3 deletions(-) diff --git a/client/src/app/+about/about-instance/about-instance.component.ts b/client/src/app/+about/about-instance/about-instance.component.ts index e1809d7b7..15841be74 100644 --- a/client/src/app/+about/about-instance/about-instance.component.ts +++ b/client/src/app/+about/about-instance/about-instance.component.ts @@ -35,6 +35,8 @@ export class AboutInstanceComponent implements OnInit, AfterViewChecked { serverConfig: ServerConfig + private lastScrollHash: string + constructor ( private viewportScroller: ViewportScroller, private route: ActivatedRoute, @@ -74,7 +76,11 @@ export class AboutInstanceComponent implements OnInit, AfterViewChecked { } ngAfterViewChecked () { - if (window.location.hash) this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + if (window.location.hash && window.location.hash !== this.lastScrollHash) { + this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + + this.lastScrollHash = window.location.hash + } } openContactModal () { diff --git a/client/src/app/+about/about-peertube/about-peertube.component.ts b/client/src/app/+about/about-peertube/about-peertube.component.ts index 98c5f93c3..b175a41bc 100644 --- a/client/src/app/+about/about-peertube/about-peertube.component.ts +++ b/client/src/app/+about/about-peertube/about-peertube.component.ts @@ -8,11 +8,17 @@ import { ViewportScroller } from '@angular/common' }) export class AboutPeertubeComponent implements AfterViewChecked { + private lastScrollHash: string + constructor ( private viewportScroller: ViewportScroller ) {} ngAfterViewChecked () { - if (window.location.hash) this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + if (window.location.hash && window.location.hash !== this.lastScrollHash) { + this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + + this.lastScrollHash = window.location.hash + } } } diff --git a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts index 5f2db9854..f73f3aa1e 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts +++ b/client/src/app/+my-account/my-account-settings/my-account-settings.component.ts @@ -23,6 +23,8 @@ export class MyAccountSettingsComponent implements OnInit, AfterViewChecked { userVideoQuotaUsedDaily = 0 userVideoQuotaDailyPercentage = 15 + private lastScrollHash: string + constructor ( private viewportScroller: ViewportScroller, private userService: UserService, @@ -64,7 +66,11 @@ export class MyAccountSettingsComponent implements OnInit, AfterViewChecked { } ngAfterViewChecked () { - if (window.location.hash) this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + if (window.location.hash && window.location.hash !== this.lastScrollHash) { + this.viewportScroller.scrollToAnchor(window.location.hash.replace('#', '')) + + this.lastScrollHash = window.location.hash + } } onAvatarChange (formData: FormData) { diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index c77dc97de..5541f5558 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -123,6 +123,7 @@ export class AppComponent implements OnInit, AfterViewInit { const scrollEvent = eventsObs.pipe(filter((e: Event): e is Scroll => e instanceof Scroll)) scrollEvent.subscribe(e => { + console.log(e) if (e.position) { return this.viewportScroller.scrollToPosition(e.position) }