Add URL hash jumping by position and sentence

Author: rollecode

CHANGELOG.md

@@ -1,3 +1,8 @@
+### 2026-04-25: 1.3.0
+
+* Jump to word position by changing URL hash to `#pos=N`
+* Jump to sentence by changing URL hash to `#sentence=N`
+
 ### 2026-03-28: 1.2.0
 
 * Store book text in IndexedDB to fix localStorage quota exceeded on iOS

README.md

@@ -1,6 +1,6 @@
 # ⚡ Speed reader
 
-![Version](https://img.shields.io/badge/version-1.2.0-blue?style=for-the-badge)
+![Version](https://img.shields.io/badge/version-1.3.0-blue?style=for-the-badge)
 ![React](https://img.shields.io/badge/React-61DAFB?style=for-the-badge&logo=react&logoColor=black)
 ![Vite](https://img.shields.io/badge/Vite-646CFF?style=for-the-badge&logo=vite&logoColor=white)
 ![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)

package.json

@@ -1,7 +1,7 @@
 {
   "name": "speed-reader",
   "private": true,
-  "version": "1.2.0",
+  "version": "1.3.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/App.jsx

@@ -287,6 +287,36 @@ function parseText(text) {
   return { words, breaks };
 }
 
+// Word indices where sentences start (0 is always first sentence)
+function getSentenceStarts(words) {
+  const starts = [0];
+  for (let i = 0; i < words.length - 1; i++) {
+    if (/[.!?]["')\]]?$/.test(words[i])) starts.push(i + 1);
+  }
+  return starts;
+}
+
+// Resolve URL hash params (pos=N or sentence=N) to a word index
+function resolveHashIndex(hashStr, words) {
+  if (!hashStr) return null;
+  const params = new URLSearchParams(hashStr.replace(/^#/, ""));
+  const sentenceParam = params.get("sentence");
+  if (sentenceParam != null) {
+    const n = parseInt(sentenceParam, 10);
+    if (!isNaN(n) && n >= 1) {
+      const starts = getSentenceStarts(words);
+      const idx = starts[Math.min(n - 1, starts.length - 1)];
+      return idx ?? 0;
+    }
+  }
+  const posParam = params.get("pos");
+  if (posParam != null) {
+    const n = parseInt(posParam, 10);
+    if (!isNaN(n) && n >= 0) return n;
+  }
+  return null;
+}
+
 // Spritz ORP algorithm - position where the eye naturally fixates
 // Based on Optimal Viewing Position research (20-35% from left)
 function getORPIndex(wordLength) {
@@ -548,14 +578,8 @@ function App() {
         setWords(parsed.words);
         setParagraphBreaks(parsed.breaks);
         // Restore position: URL hash (captured before effects) > IndexedDB > 0
-        let pos = 0;
-        if (initialUrlHash) {
-          const params = new URLSearchParams(initialUrlHash.slice(1));
-          const urlPos = parseInt(params.get("pos"), 10);
-          if (!isNaN(urlPos) && urlPos >= 0) pos = urlPos;
-        } else if (typeof savedPos === "number") {
-          pos = savedPos;
-        }
+        let pos = resolveHashIndex(initialUrlHash, parsed.words);
+        if (pos == null) pos = typeof savedPos === "number" ? savedPos : 0;
         const clamped = Math.min(Math.max(0, pos), Math.max(0, parsed.words.length - 1));
         _setCurrentIndex(clamped);
       }
@@ -728,6 +752,22 @@ function App() {
     }
   }, [currentIndex, words.length, idbLoaded]);
 
+  // React to manual URL hash changes (jump by typing #pos=N or #sentence=N)
+  useEffect(() => {
+    if (!idbLoaded || words.length === 0) return;
+    const onHashChange = () => {
+      const target = resolveHashIndex(window.location.hash, words);
+      if (target == null) return;
+      const clamped = Math.min(Math.max(0, target), words.length - 1);
+      if (clamped !== currentIndex) {
+        setIsPlaying(false);
+        _setCurrentIndex(clamped);
+      }
+    };
+    window.addEventListener("hashchange", onHashChange);
+    return () => window.removeEventListener("hashchange", onHashChange);
+  }, [idbLoaded, words, currentIndex]);
+
   const getBaseDelay = useCallback(() => {
     return (60 / wpm) * 1000;
   }, [wpm]);