feat(web): zoom du lecteur — contrôles +/−/reset (50–300 %) sur PDF et CBZ

This commit is contained in:
Git Agent
2026-08-24 14:28:53 +02:00
parent b3bd678291
commit fcf1760031
7 changed files with 158 additions and 29 deletions

View File

@ -4,7 +4,7 @@ import { ReaderError } from "./ReaderError";
import { pdfDocumentOptions } from "./pdfDocumentOptions";
import { classifyPdfCanvas, pdfCanvasVisible, pdfRenderScale, pdfSentinelBackground, type PdfRenderResult } from "./pdfRender";
import { configurePdfWorker } from "./pdfWorker";
import { clampReaderPage, readableViewportSize, readerPositionLabel, type ReaderSize } from "./readerLayout";
import { clampReaderPage, readableViewportSize, readerPositionLabel, readerZoomFactor, type ReaderSize } from "./readerLayout";
import type { ReaderControls } from "./ReaderShell";
configurePdfWorker(pdfjs);
@ -15,6 +15,7 @@ type PdfReaderProps = {
url: string;
page: number;
backHref: string;
zoom: number;
onPageCommit: (page: number, pages: number, anchor?: number, strategy?: PageCommitStrategy) => void;
onControlsChange: (controls: ReaderControls) => void;
};
@ -59,7 +60,7 @@ function afterNextPaint() {
return new Promise<void>((resolve) => requestAnimationFrame(() => resolve()));
}
export function PdfReader({ url, page, backHref, onPageCommit, onControlsChange }: PdfReaderProps) {
export function PdfReader({ url, page, backHref, zoom, onPageCommit, onControlsChange }: PdfReaderProps) {
const frameRef = useRef<HTMLDivElement>(null);
const canvasRef = useRef<HTMLCanvasElement>(null);
const [documentProxy, setDocumentProxy] = useState<pdfjs.PDFDocumentProxy | null>(null);
@ -206,7 +207,8 @@ export function PdfReader({ url, page, backHref, onPageCommit, onControlsChange
const baseViewport = pdfPage.getViewport({ scale: 1 });
const fitScale = pdfRenderScale(readerViewport, { width: baseViewport.width, height: baseViewport.height });
const pixelRatio = Math.min(2, window.devicePixelRatio || 1);
const renderScale = Math.max(0.25, Math.min(3, fitScale)) * pixelRatio;
const zoomedScale = fitScale * readerZoomFactor(zoom);
const renderScale = Math.max(0.25, zoomedScale) * pixelRatio;
const viewport = pdfPage.getViewport({ scale: renderScale });
const cssWidth = Math.floor(viewport.width / pixelRatio);
const cssHeight = Math.floor(viewport.height / pixelRatio);
@ -287,7 +289,7 @@ export function PdfReader({ url, page, backHref, onPageCommit, onControlsChange
cancelled = true;
renderTask?.cancel();
};
}, [currentPage, documentProxy, pageAttempt, viewportSize]);
}, [currentPage, documentProxy, pageAttempt, viewportSize, zoom]);
if (documentError) {
return (