hasMultiplePages

This commit is contained in:
hamid zarghami
2026-05-06 15:13:06 +03:30
parent ae7eae34d9
commit 25822b05a6
+14 -4
View File
@@ -109,6 +109,7 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
); );
const displayWidth = Math.round(bookWidth * VIEWER_SCALE); const displayWidth = Math.round(bookWidth * VIEWER_SCALE);
const displayHeight = Math.round(bookHeight * VIEWER_SCALE); const displayHeight = Math.round(bookHeight * VIEWER_SCALE);
const hasMultiplePages = pages.length > 1;
// موبایل: از ابعاد viewport برای جا دادن کتاب در صفحه // موبایل: از ابعاد viewport برای جا دادن کتاب در صفحه
const [viewport, setViewport] = useState(() => const [viewport, setViewport] = useState(() =>
@@ -290,6 +291,7 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
}, [isAutoPlayActive]); }, [isAutoPlayActive]);
const handleLinkClick = useCallback((linkUrl: string) => { const handleLinkClick = useCallback((linkUrl: string) => {
if (pages.length <= 1) return;
if (linkUrl.startsWith('page://')) { if (linkUrl.startsWith('page://')) {
const action = linkUrl.replace('page://', ''); const action = linkUrl.replace('page://', '');
const pageFlipAPI = bookRef.current?.pageFlip() as PageFlipWithFlipController | undefined; const pageFlipAPI = bookRef.current?.pageFlip() as PageFlipWithFlipController | undefined;
@@ -432,13 +434,13 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
startPage={startPage} startPage={startPage}
autoSize={false} autoSize={false}
maxShadowOpacity={isDesktop ? 0.5 : 0} maxShadowOpacity={isDesktop ? 0.5 : 0}
showCover={true} showCover={hasMultiplePages}
mobileScrollSupport={!usePortrait} mobileScrollSupport={!usePortrait}
clickEventForward={true} clickEventForward={true}
useMouseEvents={true} useMouseEvents={hasMultiplePages}
swipeDistance={usePortrait ? 48 : 30} swipeDistance={hasMultiplePages ? (usePortrait ? 48 : 30) : 9999}
startZIndex={1} startZIndex={1}
showPageCorners={true} showPageCorners={hasMultiplePages}
disableFlipByClick={true} disableFlipByClick={true}
className="flipbook-container mx-auto max-w-full" className="flipbook-container mx-auto max-w-full"
style={{}} style={{}}
@@ -464,6 +466,8 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
</div> </div>
<div className="shrink-0 max-md:min-h-12 flex items-center gap-3 md:gap-6 bg-white rounded-full px-4 md:px-6 py-2 md:py-3 shadow-lg"> <div className="shrink-0 max-md:min-h-12 flex items-center gap-3 md:gap-6 bg-white rounded-full px-4 md:px-6 py-2 md:py-3 shadow-lg">
{hasMultiplePages && (
<>
{/* دکمه راست: فارسی = صفحه بعد | لاتین = صفحه قبل */} {/* دکمه راست: فارسی = صفحه بعد | لاتین = صفحه قبل */}
<button <button
type="button" type="button"
@@ -481,6 +485,8 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
> >
<ArrowRight2 color='black' size={20} className="text-gray-700 md:w-6 md:h-6" /> <ArrowRight2 color='black' size={20} className="text-gray-700 md:w-6 md:h-6" />
</button> </button>
</>
)}
{/* شماره صفحه */} {/* شماره صفحه */}
<div className="flex items-center gap-2 min-w-[100px] md:min-w-[120px] justify-center"> <div className="flex items-center gap-2 min-w-[100px] md:min-w-[120px] justify-center">
@@ -489,6 +495,8 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
</span> </span>
</div> </div>
{hasMultiplePages && (
<>
{/* دکمه چپ: فارسی = صفحه قبل | لاتین = صفحه بعد */} {/* دکمه چپ: فارسی = صفحه قبل | لاتین = صفحه بعد */}
<button <button
type="button" type="button"
@@ -506,6 +514,8 @@ const BookViewer: FC<BookViewerProps> = ({ pages, catalogSize, documentSettings
> >
<ArrowLeft2 color='black' size={20} className="text-gray-700 md:w-6 md:h-6" /> <ArrowLeft2 color='black' size={20} className="text-gray-700 md:w-6 md:h-6" />
</button> </button>
</>
)}
</div> </div>
</div> </div>
); );