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

@ -1,7 +1,7 @@
import { useCallback, useEffect, useRef, useState } from "react";
import { api } from "../api/client";
import type { CbzPagesDto } from "../api/types";
import { clampReaderPage, orientedContainPageSize, readableViewportSize, readerPositionLabel, type ReaderSize } from "./readerLayout";
import { clampReaderPage, orientedContainPageSize, readableViewportSize, readerPositionLabel, zoomReaderSize, type ReaderSize } from "./readerLayout";
import type { ReaderControls } from "./ReaderShell";
type PageCommitStrategy = "immediate" | "queued";
@ -9,11 +9,13 @@ type PageCommitStrategy = "immediate" | "queued";
export function CbzReader({
bookId,
page,
zoom,
onPageCommit,
onControlsChange
}: {
bookId: number;
page: number;
zoom: number;
onPageCommit: (page: number, pages: number, anchor?: number, strategy?: PageCommitStrategy) => void;
onControlsChange: (controls: ReaderControls) => void;
}) {
@ -50,7 +52,7 @@ export function CbzReader({
const pageCount = pages?.pageCount ?? 1;
const currentPage = clampReaderPage(page, pageCount);
const currentName = pages?.pages.find((item) => item.page === currentPage)?.name;
const fittedSize = viewportSize && imageSize ? orientedContainPageSize(viewportSize, imageSize) : null;
const fittedSize = viewportSize && imageSize ? zoomReaderSize(orientedContainPageSize(viewportSize, imageSize), zoom) : null;
const imageStyle = fittedSize ? { width: `${fittedSize.width}px`, height: `${fittedSize.height}px` } : undefined;
const go = useCallback(