PDF Polish (#2837)

Co-authored-by: William Brockhus <pickeringw@gmail.com>
This commit is contained in:
Joe Milazzo 2024-04-09 17:57:28 -05:00 committed by GitHub
parent 6ed634f5d1
commit 752fda0e93
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 103 additions and 106 deletions

View file

@ -43,11 +43,12 @@
(pdfLoaded)="updateLoading(false)"
(progress)="updateLoadProgress($event)"
(zoomChange)="calcScrollbarNeeded()"
(handToolChange)="updateHandTool($event)"
>
</ngx-extended-pdf-viewer>
@if (scrollMode === ScrollModeType.page) {
@if (scrollMode === ScrollModeType.page && !isLoading) {
<div class="left" (click)="prevPage()"></div>
<div class="{{scrollbarNeeded ? 'right-with-scrollbar' : 'right'}}" (click)="nextPage()"></div>
}
@ -85,13 +86,13 @@
<pdf-select-tool></pdf-select-tool>
<pdf-presentation-mode></pdf-presentation-mode>
@if (utilityService.getActiveBreakpoint() > Breakpoint.Mobile) {
<button (click)="toggleBookPageMode()" class="btn-icon toolbarButton" [ngbTooltip]="pageLayoutMode | pdfLayoutMode" [disabled]="scrollMode === ScrollModeType.page">
<i class="toolbar-icon fa-solid {{this.pageLayoutMode !== 'book' ? 'fa-book' : 'fa-book-open'}}" [ngStyle]="{color: fontColor}" aria-hidden="true"></i>
<span class="visually-hidden">{{this.pageLayoutMode | pdfLayoutMode}}</span>
</button>
}
<!-- The book mode is messy, not ready for prime time -->
<!-- @if (utilityService.getActiveBreakpoint() > Breakpoint.Mobile) {-->
<!-- <button (click)="toggleBookPageMode()" class="btn-icon toolbarButton" [ngbTooltip]="pageLayoutMode | pdfLayoutMode" [disabled]="scrollMode === ScrollModeType.page">-->
<!-- <i class="toolbar-icon fa-solid {{this.pageLayoutMode !== 'book' ? 'fa-book' : 'fa-book-open'}}" [ngStyle]="{color: fontColor}" aria-hidden="true"></i>-->
<!-- <span class="visually-hidden">{{this.pageLayoutMode | pdfLayoutMode}}</span>-->
<!-- </button>-->
<!-- }-->
<!-- scroll mode should be disabled when book mode is used -->

View file

@ -34,8 +34,11 @@ $pagination-opacity: 0;
//$pagination-color: red;
//$pagination-opacity: 0.7;
$action-bar-height: 36px;
$loading-bar-height: 24px;
// Tap to Paginate
.right {
position: absolute;
right: 0px;

View file

@ -34,6 +34,7 @@ import {SpreadType} from "ngx-extended-pdf-viewer/lib/options/spread-type";
import {PdfLayoutModePipe} from "../../_pipe/pdf-layout-mode.pipe";
import {PdfScrollModePipe} from "../../_pipe/pdf-scroll-mode.pipe";
import {PdfSpreadModePipe} from "../../_pipe/pdf-spread-mode.pipe";
import {HandtoolChanged} from "ngx-extended-pdf-viewer/lib/events/handtool-changed";
@Component({
selector: 'app-pdf-reader',
@ -236,7 +237,7 @@ export class PdfReaderComponent implements OnInit, OnDestroy {
init() {
this.pageLayoutMode = this.convertPdfLayoutMode(this.user.preferences.pdfLayoutMode || PdfLayoutMode.Multiple);
this.pageLayoutMode = this.convertPdfLayoutMode(PdfLayoutMode.Multiple);
this.scrollMode = this.convertPdfScrollMode(this.user.preferences.pdfScrollMode || PdfScrollMode.Vertical);
this.spreadMode = this.convertPdfSpreadMode(this.user.preferences.pdfSpreadMode || PdfSpreadMode.None);
this.theme = this.convertPdfTheme(this.user.preferences.pdfTheme || PdfTheme.Dark);
@ -350,6 +351,10 @@ export class PdfReaderComponent implements OnInit, OnDestroy {
this.cdRef.markForCheck();
}
updateHandTool(event: any) {
console.log('event.tool', event);
}
prevPage() {
this.currentPage--;
if (this.currentPage < 0) this.currentPage = 0;