diff --git a/src/js/lib/Quran/Slice.ts b/src/js/lib/Quran/Slice.ts index 77fc7ae6b..dc8d33427 100644 --- a/src/js/lib/Quran/Slice.ts +++ b/src/js/lib/Quran/Slice.ts @@ -1,36 +1,35 @@ export interface Slice { begin: number - end: number - length: number + end: number | null coversOneAyah: boolean coversOneSurah: boolean coversSubsetOfSurah: boolean + subsetLength: number toParam: () => string | null } -export function Slice(begin: number, end: number): Slice { +export function Slice(begin: number, end: number | null): Slice { const self: Slice = Object.create(null); self.begin = begin; self.end = end; - self.coversOneAyah = begin === end; + self.coversOneAyah = end === null; self.coversOneSurah = begin === 1 && end === 286; - self.coversSubsetOfSurah = begin >= 1 && end < 286; - self.length = end - (begin - 1); - - self.toParam = () => { - if (self.coversOneAyah) { - return `${self.begin}`; - } else if(self.coversSubsetOfSurah) { - return `${self.begin}..${self.end}`; - } else { - return null; - } - }; + self.coversSubsetOfSurah = end !== null && begin >= 1 && end < 286; + self.subsetLength = getSubsetLength(self); return self; } +const getSubsetLength = (slice: Slice) => { + const { begin, end } = slice; + if (end) { + return end - (begin - 1); + } else { + return 0; + } +}; + const digitsRange = /^(\d{1,3})\.\.(\d{1,3})$/; const digits = /^\d{1,3}$/; Slice.fromParam = function(param: string | null): Slice { @@ -42,7 +41,7 @@ Slice.fromParam = function(param: string | null): Slice { const [, begin, end] = match; return Slice(parseInt(begin), parseInt(end)); } else if (digits.test(param)) { - return Slice(parseInt(param), parseInt(param)); + return Slice(parseInt(param), null); } else { return Slice(1, 286); } diff --git a/src/js/pages/surah/stream.tsx b/src/js/pages/surah/stream.tsx index ac4421c80..21aef880d 100644 --- a/src/js/pages/surah/stream.tsx +++ b/src/js/pages/surah/stream.tsx @@ -26,10 +26,17 @@ function SurahStream({ node, locale, slice, paused, t }: Props) { const [theme, setTheme] = useState(getCookie('theme') || 'moon'); const [surah] = useState(Quran.Surah.fromDOMNode(locale, node)); const readyToRender = stream.length > 0; + 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', slice.toParam() || stream.length], + ['ayah', getAyahParam(slice, stream)], ['paused', isPaused ? 't' : null] ]; const query = params.filter(([, v]) => v).flatMap(([k,v]) => `${k}=${v}`).join('&'); @@ -39,7 +46,7 @@ function SurahStream({ node, locale, slice, paused, t }: Props) { if (slice.coversOneAyah || slice.coversOneSurah) { return stream.length === surah.ayat.length; } else if (slice.coversSubsetOfSurah) { - return stream.length === slice.length; + return stream.length === slice.subsetLength; } else { return false; } @@ -47,7 +54,7 @@ function SurahStream({ node, locale, slice, paused, t }: Props) { useEffect(() => { if (slice.coversOneAyah) { - setStream([...surah.ayat.slice(0, slice.end)]); + setStream([...surah.ayat.slice(0, slice.begin)]); } else { setStream([surah.ayat[slice.begin - 1]]); }