Remove Quran.Slice

Fix #147
ReflectsLight · Sep 15, 2023 · a6d8cac · a6d8cac
1 parent 6d3261c
commit a6d8cac
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 94 deletions.
diff --git a/src/js/components/Stream.tsx b/src/js/components/Stream.tsx
@@ -1,28 +1,18 @@
 import * as Quran from "lib/Quran";
 import React, { useEffect } from "react";
 import { formatNumber, TFunction } from "lib/i18n";
-import { Slice } from "lib/Quran/Slice";
 import classNames from "classnames";
 
 interface Props {
   surah: Quran.Surah;
   stream: Quran.Ayat;
   locale: Quran.Locale;
-  slice: Slice;
   endOfStream: boolean;
   isPaused: boolean;
   t: TFunction;
 }
 
-export function Stream({
-  surah,
-  stream,
-  locale,
-  slice,
-  endOfStream,
-  isPaused,
-  t,
-}: Props) {
+export function Stream({ surah, stream, locale, endOfStream, isPaused, t }: Props) {
   const className = classNames("body", "stream");
   const style: React.CSSProperties =
     endOfStream || isPaused ? { overflowY: "auto" } : { overflowY: "hidden" };
@@ -40,12 +30,7 @@ export function Stream({
 
   useEffect(() => {
     const ul: HTMLElement = document.querySelector("ul.stream")!;
-    if (slice.coversOneAyah) {
-      const li: HTMLLIElement = ul.querySelector("li:last-child")!;
-      li.scrollIntoView();
-    } else {
-      ul.scroll({ top: ul.scrollHeight, behavior: "smooth" });
-    }
+    ul.scroll({ top: ul.scrollHeight, behavior: "smooth" });
   }, [stream]);
 
   return (

diff --git a/src/js/lib/Quran/Slice.ts b/src/js/lib/Quran/Slice.ts
diff --git a/src/js/pages/surah/stream.tsx b/src/js/pages/surah/stream.tsx
@@ -16,14 +16,12 @@ import {
   LoadingShape,
 } from "components/Shape";
 import * as Quran from "lib/Quran";
-import { Slice } from "lib/Quran/Slice";
 import { i18n, TFunction } from "lib/i18n";
 
 interface Props {
   node: HTMLScriptElement;
   reciters: Quran.Reciter[];
   locale: Quran.Locale;
-  slice: Slice;
   paused: boolean;
   t: TFunction;
 }
@@ -40,7 +38,7 @@ const getAudioURL = (reciter: Quran.Reciter, surah: Quran.Surah, stream: Quran.A
   return `${baseUrl}/${surah.id}/${ayah?.id}.mp3`;
 };
 
-function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
+function SurahStream({ node, reciters, locale, paused, t }: Props) {
   const [stream, setStream] = useState<Quran.Ayat>([]);
   const [isPaused, setIsPaused] = useState<boolean>(paused);
   const [soundOn, setSoundOn] = useState<boolean>(false);
@@ -53,19 +51,9 @@ function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
   );
   const readyToRender = stream.length > 0;
   const audioRef = useRef<HTMLAudioElement>(null);
-  const getAyahParam = (slice: Slice, stream: Quran.Ayat) => {
-    if (slice.coversSubsetOfSurah) {
-      return `${slice.begin}..${slice.end}`;
-    } else {
-      return stream.length;
-    }
-  };
   const onLanguageChange = (o: SelectOption) => {
     const locale = o.value;
-    const params = [
-      ["ayah", getAyahParam(slice, stream)],
-      ["paused", isPaused ? "t" : null],
-    ];
+    const params = [["paused", isPaused ? "t" : null]];
     const query = params
       .filter(([, v]) => v)
       .flatMap(([k, v]) => `${k}=${v}`)
@@ -74,11 +62,7 @@ function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
   };
 
   useEffect(() => {
-    if (slice.coversOneAyah) {
-      setStream([...surah.ayat.slice(0, slice.begin)]);
-    } else {
-      setStream([surah.ayat[slice.begin - 1]]);
-    }
+    setStream([surah.ayat[0]]);
   }, [stream.length === 0]);
 
   useEffect(() => {
@@ -137,7 +121,6 @@ function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
       )}
       {readyToRender && (
         <Stream
-          slice={slice}
           surah={surah}
           stream={stream}
           locale={locale}
@@ -192,21 +175,13 @@ function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
   const toBoolean = (str: string | null): boolean =>
     str !== null && ["1", "t", "true", "yes"].includes(str);
   const params = new URLSearchParams(location.search);
-  const slice = Slice.fromParam(params.get("ayah"));
   const paused = toBoolean(params.get("paused"));
   const reciters = JSON.parse(
     document.querySelector<HTMLElement>(".json.reciters")!.innerText,
   );
   const t = i18n(document.querySelector<HTMLElement>(".json.i18n")!.innerText);
 
   ReactDOM.createRoot(root).render(
-    <SurahStream
-      reciters={reciters}
-      node={node}
-      locale={locale}
-      slice={slice}
-      paused={paused}
-      t={t}
-    />,
+    <SurahStream reciters={reciters} node={node} locale={locale} paused={paused} t={t} />,
   );
 })();