From 0177a03a906d76efa6a9db74972089a32283e326 Mon Sep 17 00:00:00 2001
From: Huang Xin <chrox.huang@gmail.com>
Date: Sun, 22 Mar 2026 01:08:45 +0800
Subject: [PATCH] fix(tts): properly follow tts reading position in scrolled
 mode (#3581)

---
 .../src/app/reader/components/ProgressBar.tsx  |  2 +-
 .../src/app/reader/hooks/useTTSControl.ts      | 18 ++++++++----------
 apps/readest-app/src/types/view.ts             |  6 ++----
 packages/foliate-js                            |  2 +-
 4 files changed, 12 insertions(+), 16 deletions(-)

diff --git a/apps/readest-app/src/app/reader/components/ProgressBar.tsx b/apps/readest-app/src/app/reader/components/ProgressBar.tsx
index 15bd1cdb..355d4e7b 100644
--- a/apps/readest-app/src/app/reader/components/ProgressBar.tsx
+++ b/apps/readest-app/src/app/reader/components/ProgressBar.tsx
@@ -53,7 +53,7 @@ const ProgressBar: React.FC<ProgressBarProps> = ({
   const pageInfo = bookData?.isFixedLayout ? section : pageinfo;
   const progressInfo = formatProgress(pageInfo?.current, pageInfo?.total, template, localize, lang);
 
-  const { sectionPage: current = 0, sectionPages: total = 0 } = view?.renderer || {};
+  const { page: current = 0, pages: total = 0 } = view?.renderer || {};
   const pagesLeft = Math.min(
     Math.max(total - current, 1),
     pageInfo ? pageInfo.total - pageInfo.current : total,
diff --git a/apps/readest-app/src/app/reader/hooks/useTTSControl.ts b/apps/readest-app/src/app/reader/hooks/useTTSControl.ts
index c48cf7ed..5995b877 100644
--- a/apps/readest-app/src/app/reader/hooks/useTTSControl.ts
+++ b/apps/readest-app/src/app/reader/hooks/useTTSControl.ts
@@ -149,11 +149,9 @@ export const useTTSControl = ({ bookKey, onRequestHidePanel }: UseTTSControlProp
         view.renderer.scrollToAnchor?.(range);
       } else {
         const rect = range.getBoundingClientRect();
-        const { start, size, viewSize, sideProp } = view.renderer;
-        const positionStart = rect[sideProp === 'height' ? 'y' : 'x'] + viewSettings.marginTopPx;
-        const positionEnd = rect[sideProp === 'height' ? 'height' : 'width'] + positionStart;
-        const offsetStart = view.book.dir === 'rtl' ? viewSize - positionStart : positionStart;
-        const offsetEnd = view.book.dir === 'rtl' ? viewSize - positionEnd : positionEnd;
+        const { start, end, sideProp } = view.renderer;
+        const rangeTop = rect[sideProp === 'height' ? 'y' : 'x'];
+        const rangeBottom = rangeTop + rect[sideProp === 'height' ? 'height' : 'width'];
 
         const showHeader = viewSettings.showHeader;
         const showFooter = viewSettings.showFooter;
@@ -161,11 +159,11 @@ export const useTTSControl = ({ bookKey, onRequestHidePanel }: UseTTSControlProp
         const headerScrollOverlap = showHeader && showBarsOnScroll ? 44 : 0;
         const footerScrollOverlap = showFooter && showBarsOnScroll ? 44 : 0;
         const scrollingOverlap = viewSettings.scrollingOverlap;
-        const endInNextView = offsetEnd > start + size - footerScrollOverlap - scrollingOverlap;
-        const startInPrevView = offsetStart < start + headerScrollOverlap + scrollingOverlap;
-        if (endInNextView || startInPrevView) {
-          const scrollTo = offsetStart - headerScrollOverlap - scrollingOverlap;
-          view.renderer.scrollToAnchor?.(scrollTo / viewSize);
+        const outOfView =
+          rangeBottom > end - footerScrollOverlap - scrollingOverlap ||
+          rangeTop < start + headerScrollOverlap + scrollingOverlap;
+        if (outOfView) {
+          view.renderer.scrollToAnchor?.(range);
         }
       }
     };
diff --git a/apps/readest-app/src/types/view.ts b/apps/readest-app/src/types/view.ts
index ecec72c9..3f3d5769 100644
--- a/apps/readest-app/src/types/view.ts
+++ b/apps/readest-app/src/types/view.ts
@@ -66,10 +66,8 @@ export interface FoliateView extends HTMLElement {
     viewSize: number; // whole document view height
     start: number;
     end: number;
-    page: number; // rendered page index (0-based)
-    pages: number; // rendered page count
-    sectionPage: number; // current page index in the current section
-    sectionPages: number; // page count in the current section
+    page: number; // section page index (0-based)
+    pages: number; // section page count
     atStart: boolean;
     atEnd: boolean;
     containerPosition: number;
diff --git a/packages/foliate-js b/packages/foliate-js
index d150ae5e..57e35351 160000
--- a/packages/foliate-js
+++ b/packages/foliate-js
@@ -1 +1 @@
-Subproject commit d150ae5eaa0f35e39a9eabb069595dbd408206ca
+Subproject commit 57e35351b18a74e7d8dcd49de5f66d9110a7536a