diff --git a/src/pages/viewer/components/BookViewer.tsx b/src/pages/viewer/components/BookViewer.tsx index 0ec7e38..1492597 100644 --- a/src/pages/viewer/components/BookViewer.tsx +++ b/src/pages/viewer/components/BookViewer.tsx @@ -2,7 +2,7 @@ import { type FC, useRef, useCallback, useState, useEffect, useLayoutEffect, use import HTMLFlipBook from 'react-pageflip'; import { type PageData } from '../types'; import BookPage from './BookPage'; -import { ArrowLeft2, ArrowRight2 } from 'iconsax-react'; +import { ArrowLeft2, ArrowRight2, Pause, Play } from 'iconsax-react'; import { getPaperDimensions } from '@/config/paperSizes'; import type { DocumentSettings } from '@/pages/editor/store/editorStore'; @@ -61,6 +61,27 @@ type PageFlipWithFlipController = PageFlipAPI & { getFlipController: () => { flip: (p: { x: number; y: number }) => void }; }; +type AutoPlayToggleButtonProps = { + isActive: boolean; + onToggle: () => void; +}; + +const AutoPlayToggleButton: FC = ({ isActive, onToggle }) => ( + +); + /** * page-flip داخل flipPrev با x=10 ثابت می‌زند؛ با disableFlipByClick آزمایش گوشه رد می‌شود * (چون bookPos.x = 10 - rect.left معمولاً ≤ 0). flipNext همان rect.left را جمع می‌کند. @@ -84,7 +105,7 @@ function triggerFlipPrev(api: PageFlipWithFlipController | undefined) { */ const BookViewer: FC = ({ pages, catalogSize, documentSettings }) => { const bookRef = useRef(null); - const pageFlipHandlerRef = useRef<(e: FlipEvent) => void>(() => {}); + const pageFlipHandlerRef = useRef<(e: FlipEvent) => void>(() => { }); const [currentPage, setCurrentPage] = useState(0); const [isAutoPlayActive, setIsAutoPlayActive] = useState(false); const [startPage, setStartPage] = useState(0); @@ -290,6 +311,11 @@ const BookViewer: FC = ({ pages, catalogSize, documentSettings } }, [isAutoPlayActive]); + const toggleAutoPlay = useCallback(() => { + if (pages.length <= 1) return; + setIsAutoPlayActive(prev => !prev); + }, [pages.length]); + const handleLinkClick = useCallback((linkUrl: string) => { if (pages.length <= 1) return; if (linkUrl.startsWith('page://')) { @@ -495,6 +521,8 @@ const BookViewer: FC = ({ pages, catalogSize, documentSettings + + {hasMultiplePages && ( <> {/* دکمه چپ: فارسی = صفحه قبل | لاتین = صفحه بعد */} @@ -516,6 +544,10 @@ const BookViewer: FC = ({ pages, catalogSize, documentSettings )} + + {hasMultiplePages && autoPlay && ( + + )} );