Skip to content

Commit

Permalink
Merge pull request #148 from ReflectsLight/remove_slice
Browse files Browse the repository at this point in the history
Remove `Quran.Slice`
  • Loading branch information
0x1eef authored Sep 16, 2023
2 parents 6d3261c + a6d8cac commit cbfd089
Show file tree
Hide file tree
Showing 3 changed files with 6 additions and 94 deletions.
19 changes: 2 additions & 17 deletions src/js/components/Stream.tsx
Original file line number Diff line number Diff line change
@@ -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" };
Expand All @@ -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 (
Expand Down
48 changes: 0 additions & 48 deletions src/js/lib/Quran/Slice.ts

This file was deleted.

33 changes: 4 additions & 29 deletions src/js/pages/surah/stream.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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;
}
Expand All @@ -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);
Expand All @@ -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}`)
Expand All @@ -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(() => {
Expand Down Expand Up @@ -137,7 +121,6 @@ function SurahStream({ node, reciters, locale, slice, paused, t }: Props) {
)}
{readyToRender && (
<Stream
slice={slice}
surah={surah}
stream={stream}
locale={locale}
Expand Down Expand Up @@ -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} />,
);
})();

0 comments on commit cbfd089

Please sign in to comment.