From ccbd9b2f5cc9dd9f31eee385e63806a94a09e102 Mon Sep 17 00:00:00 2001
From: Sergey Elpashev <elpashevs@bk.ru>
Date: Wed, 10 Jul 2024 23:33:40 +0300
Subject: [PATCH] feat: started manhwa scrolling

---
 .../app/components/reader/reader.component.ts | 29 +++++++++++++++++--
 .../notification/notification.service.ts      |  8 +++--
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/apps/NwaifuAnime/src/app/components/reader/reader.component.ts b/apps/NwaifuAnime/src/app/components/reader/reader.component.ts
index 932d525..61fa8ed 100644
--- a/apps/NwaifuAnime/src/app/components/reader/reader.component.ts
+++ b/apps/NwaifuAnime/src/app/components/reader/reader.component.ts
@@ -1,7 +1,7 @@
 import { CommonModule } from "@angular/common";
 import { AfterViewInit, Component, OnDestroy } from "@angular/core";
 import { ActivatedRoute, Router, RouterLink } from "@angular/router";
-import { Observable, Subject, map, takeUntil } from "rxjs";
+import { BehaviorSubject, Observable, Subject, map, takeUntil } from "rxjs";
 import { Chapter, Page } from "../../services/parsers/rulib/rulib.chapter.dto";
 import { IRulibChapter } from "../../services/parsers/rulib/rulib.chapters.dto";
 import { SearchService } from "../../services/search.service";
@@ -28,6 +28,7 @@ export class ReaderComponent implements AfterViewInit, OnDestroy {
   url = "";
   private fromTowards = false;
   private destroy$ = new Subject<void>();
+  private isManhwa$ = new BehaviorSubject<boolean>(false);
 
   constructor(
     private route: ActivatedRoute,
@@ -37,6 +38,7 @@ export class ReaderComponent implements AfterViewInit, OnDestroy {
   ngOnDestroy(): void {
     this.destroy$.next();
     this.destroy$.complete();
+    this.isManhwa$.complete();
   }
 
   ngAfterViewInit(): void {
@@ -62,6 +64,29 @@ export class ReaderComponent implements AfterViewInit, OnDestroy {
         this.router.navigate(["/"]);
       }
     });
+    this.isManhwa$.pipe(takeUntil(this.destroy$)).subscribe((isManhwa) => {
+      this.isManhwa = isManhwa;
+      if (isManhwa) this.initManhwaScroll();
+      else this.noManhwaScroll();
+    });
+  }
+
+  private handleScrollManhwa(event: Event) {
+    console.log(event);
+  }
+
+  private initManhwaScroll() {
+    const component = document.querySelector("app-reader");
+    if (component && this.isManhwa) {
+      component.addEventListener("scroll", this.handleScrollManhwa.bind(this));
+    }
+  }
+
+  private noManhwaScroll() {
+    const component = document.querySelector("app-reader");
+    if (component && !this.isManhwa) {
+      component.removeEventListener("scroll", this.handleScrollManhwa.bind(this));
+    }
   }
 
   backToTitle() {
@@ -203,7 +228,7 @@ export class ReaderComponent implements AfterViewInit, OnDestroy {
       const imageUrl = this.imageUrl;
       const image = new Image();
       image.onload = () => {
-        this.isManhwa = image.naturalHeight / image.naturalWidth >= 5;
+        this.isManhwa$.next(image.naturalHeight / image.naturalWidth >= 5);
         URL.revokeObjectURL(imageUrl);
       };
       image.src = imageUrl;
diff --git a/apps/NwaifuAnime/src/app/services/notification/notification.service.ts b/apps/NwaifuAnime/src/app/services/notification/notification.service.ts
index ae34159..3229839 100644
--- a/apps/NwaifuAnime/src/app/services/notification/notification.service.ts
+++ b/apps/NwaifuAnime/src/app/services/notification/notification.service.ts
@@ -1,11 +1,11 @@
-import { Injectable } from "@angular/core";
+import { Injectable, OnDestroy } from "@angular/core";
 import { Subject } from "rxjs";
 import { INotification } from "./notification.dto";
 
 @Injectable({
   providedIn: "root",
 })
-export class NotificationService {
+export class NotificationService implements OnDestroy {
   readonly notification$ = new Subject<INotification>();
 
   private sendNotification(message: INotification) {
@@ -29,4 +29,8 @@ export class NotificationService {
       name: title,
     });
   }
+
+  ngOnDestroy(): void {
+    this.notification$.complete();
+  }
 }