From 52fec34c7aad2bf62e411a27af58a174a0a45653 Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Wed, 9 Nov 2022 12:08:54 +0000
Subject: [PATCH] Refactor #12057

---
 src/app/components/animate/animate.ts | 96 +++------------------------
 1 file changed, 10 insertions(+), 86 deletions(-)

diff --git a/src/app/components/animate/animate.ts b/src/app/components/animate/animate.ts
index 5a746af6b5d..fb4e9270315 100644
--- a/src/app/components/animate/animate.ts
+++ b/src/app/components/animate/animate.ts
@@ -1,6 +1,6 @@
-import { NgModule, Directive, ElementRef, Input, Renderer2, Inject, NgZone } from '@angular/core';
-import { CommonModule, DOCUMENT } from '@angular/common';
-import { DomHandler } from '../dom/domhandler';
+import { CommonModule } from '@angular/common';
+import { AfterViewInit, Directive, ElementRef, Input, NgModule, Renderer2 } from '@angular/core';
+import { DomHandler } from 'primeng/dom';
 
 @Directive({
     selector: '[pAnimate]',
@@ -8,28 +8,15 @@ import { DomHandler } from '../dom/domhandler';
         '[class.p-animate]': 'true'
     }
 })
-export class Animate {
+export class Animate implements AfterViewInit {
     @Input() enterClass: string;
 
-    @Input() leaveClass: string;
-
-    documentScrollListener: Function | null = null;
-
-    loadListener: Function = () => {};
-
-    entered: boolean;
-
     observer: IntersectionObserver;
 
-    loaded: boolean;
-
-    constructor(@Inject(DOCUMENT) private document: Document, private host: ElementRef, public el: ElementRef, public renderer: Renderer2, private zone: NgZone) {}
+    constructor(private host: ElementRef, public el: ElementRef, public renderer: Renderer2) {}
 
-    ngOnInit() {
-        if (this.isInViewport()) {
-            this.enter();
-        }
-        this.bindLoadListener();
+    ngAfterViewInit() {
+        this.bindIntersectionObserver();
     }
 
     bindIntersectionObserver() {
@@ -39,33 +26,13 @@ export class Animate {
             threshold: 1.0
         };
 
-        this.zone.runOutsideAngular(() => {
-            this.observer = new IntersectionObserver((el) => this.isVisible(el), options);
-            this.observer.observe(this.host.nativeElement);
-        });
-    }
-
-    isInViewport() {
-        let rect = this.host.nativeElement.getBoundingClientRect();
-
-        return rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight + rect.height || this.document.documentElement.clientHeight) && rect.right <= (window.innerWidth || this.document.documentElement.clientWidth);
+        this.observer = new IntersectionObserver((el) => this.isVisible(el), options);
+        this.observer.observe(this.host.nativeElement);
     }
 
     isVisible(element: IntersectionObserverEntry[]) {
         const [intersectionObserverEntry] = element;
-        this.entered = intersectionObserverEntry.isIntersecting;
-    }
-
-    animate() {
-        if (this.loaded) {
-            if (this.isInViewport() && this.entered) {
-                this.enter();
-            }
-
-            if (!this.isInViewport() && !this.entered) {
-                this.leave();
-            }
-        }
+        intersectionObserverEntry.isIntersecting ? this.enter() : this.leave();
     }
 
     enter() {
@@ -78,47 +45,6 @@ export class Animate {
         this.host.nativeElement.style.visibility = 'hidden';
     }
 
-    bindDocumentScrollListener() {
-        if (!this.documentScrollListener) {
-            this.zone.runOutsideAngular(() => {
-                this.documentScrollListener = this.renderer.listen(window, 'scroll', () => {
-                    if (!this.observer) {
-                        this.bindIntersectionObserver();
-                    }
-                    this.animate();
-                });
-            });
-        }
-    }
-
-    unbindDocumentScrollListener() {
-        if (this.documentScrollListener) {
-            this.documentScrollListener();
-            this.documentScrollListener = null;
-        }
-    }
-
-    bindLoadListener() {
-        this.zone.runOutsideAngular(() => {
-            this.loadListener = this.renderer.listen(window, 'load', () => {
-                if (!this.loaded) {
-                    this.animate();
-                }
-                if (!this.documentScrollListener) {
-                    this.bindDocumentScrollListener();
-                }
-                this.loaded = true;
-            });
-        });
-    }
-
-    unbindLoadListener() {
-        if (this.loadListener) {
-            this.loadListener();
-            this.loadListener = null;
-        }
-    }
-
     unbindIntersectionObserver() {
         if (this.observer) {
             this.observer.unobserve(this.host.nativeElement);
@@ -126,8 +52,6 @@ export class Animate {
     }
 
     ngOnDestroy() {
-        this.unbindDocumentScrollListener();
-        this.unbindLoadListener();
         this.unbindIntersectionObserver();
     }
 }