Restore PDF layout menu (#2605)

Kareadita · Jan 18, 2024 · f44ba1c · f44ba1c
1 parent e77d1c0
commit f44ba1c
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 4 deletions.
diff --git a/UI/Web/package-lock.json b/UI/Web/package-lock.json
diff --git a/UI/Web/src/app/pdf-reader/_components/pdf-reader/pdf-reader.component.html b/UI/Web/src/app/pdf-reader/_components/pdf-reader/pdf-reader.component.html
@@ -33,6 +33,7 @@
       [backgroundColor]="backgroundColor"
       [customToolbar]="multiToolbar"
       [language]="user.preferences.locale"
+      [(scrollMode)]="scrollMode"
 
       (pageChange)="saveProgress()"
       (pdfLoadingStarts)="updateLoading(true)"
@@ -86,6 +87,14 @@
 
           <div class="verticalToolbarSeparator hiddenSmallView"></div>
           <pdf-toggle-secondary-toolbar></pdf-toggle-secondary-toolbar>
+
+          <pdf-single-page-mode [show]="true" [scrollMode]="scrollMode"></pdf-single-page-mode>
+          <pdf-vertical-scroll-mode [show]="true" [scrollMode]="scrollMode"></pdf-vertical-scroll-mode>
+          <pdf-horizontal-scroll [show]="true" [scrollMode]="scrollMode"></pdf-horizontal-scroll>
+          <pdf-wrapped-scroll-mode [show]="true" [scrollMode]="scrollMode"></pdf-wrapped-scroll-mode>
+          <pdf-no-spread [show]=true [scrollMode]="scrollMode"></pdf-no-spread>
+          <pdf-odd-spread [show]=true [scrollMode]="scrollMode"></pdf-odd-spread>
+          <pdf-even-spread [show]="true" [scrollMode]="scrollMode"></pdf-even-spread>
         </div>
 
       </div>

diff --git a/UI/Web/src/app/pdf-reader/_components/pdf-reader/pdf-reader.component.ts b/UI/Web/src/app/pdf-reader/_components/pdf-reader/pdf-reader.component.ts
@@ -7,7 +7,7 @@ import {
   OnInit, ViewChild
 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { NgxExtendedPdfViewerService, PageViewModeType, ProgressBarEvent, NgxExtendedPdfViewerModule } from 'ngx-extended-pdf-viewer';
+import { NgxExtendedPdfViewerService, PageViewModeType, ScrollModeType, ProgressBarEvent, NgxExtendedPdfViewerModule } from 'ngx-extended-pdf-viewer';
 import { ToastrService } from 'ngx-toastr';
 import { take } from 'rxjs';
 import { BookService } from 'src/app/book-reader/_services/book.service';
@@ -89,6 +89,8 @@ export class PdfReaderComponent implements OnInit, OnDestroy {
    */
   bookMode: PageViewModeType = 'multiple';
 
+  scrollMode: ScrollModeType = ScrollModeType.vertical;
+
   constructor(private route: ActivatedRoute, private router: Router, public accountService: AccountService,
     private seriesService: SeriesService, public readerService: ReaderService,
     private navService: NavService, private toastr: ToastrService,