Upload 7 files

quran_audio.js

@@ -32,7 +32,7 @@
     })().catch(error => {configPromise = null; throw error;});
     return configPromise;
   }
-  function createPlayer(c, verses, notify) {
+  function createPlayer(c, verses, notify, endId) {
     const byId = new Map(verses.map((v, index) => [v.id, index]));
     let saved;
     try {saved = JSON.parse(localStorage.getItem(c.storage_key));} catch { /* Preferences are optional. */ }
@@ -40,15 +40,20 @@
       reciter: c.reciters.some(r => r.id === saved?.reciter) ? saved.reciter : c.defaults.reciter,
       rate: c.rates.includes(saved?.rate) ? saved.rate : c.defaults.rate,
       repeat: c.repeat_options.some(r => r.value === saved?.repeat) ? saved.repeat : c.defaults.repeat,
-      advance: typeof saved?.advance === 'boolean' ? saved.advance : c.defaults.advance
+      advance: typeof saved?.advance === 'boolean' ? saved.advance : c.defaults.advance,
+      gap: (c.gap_options || []).some(g => g.value === saved?.gap) ? saved.gap : (c.defaults.gap_ms ?? 250)
     };
     let index = 0, media = null, token = 0, playRequest = 0, disposed = false, wantsPlay = false, repetitions = settings.repeat;
     let phase = 'idle', currentTime = 0, duration = 0, loadTimer, removeEvents = () => {};
-    const snapshot = () => ({verse:verses[index], phase, currentTime, duration, settings:{...settings}});
+    // played: the person actually started playback (used by the reader to save a resume point).
+    let played = false, gapTimer = null, pending = null, seekOnLoad = 0;
+    const lastIndex = Number.isInteger(byId.get(endId)) ? byId.get(endId) : verses.length - 1;
+    const gapMs = () => Number.isFinite(settings.gap) ? settings.gap : 250;
+    const snapshot = () => ({verse:verses[index], phase, currentTime, duration, played, settings:{...settings}});
     const emit = () => {if (!disposed) notify(snapshot());};
     const clearTimer = () => {clearTimeout(loadTimer);loadTimer = null;};
     function detach(release = false) {
-      clearTimer(); token++; playRequest++; wantsPlay = false;
+      clearTimer(); clearTimeout(gapTimer); gapTimer = null; pending = null; token++; playRequest++; wantsPlay = false;
       removeEvents(); removeEvents = () => {};
       if (media) {media.pause(); media.removeAttribute('src'); media.load(); if (release) media = null;}
     }
@@ -78,7 +83,7 @@
     }
     function playAt(id, resetRepeat = true) {
       if (disposed || !byId.has(id)) return;
-      detach(); index = byId.get(id); currentTime = 0; duration = 0;
+      detach(); index = byId.get(id); currentTime = 0; duration = 0; played = true;
       if (resetRepeat) repetitions = settings.repeat;
       // Reuse the element unlocked by the user's first play gesture.
       const activeMedia = media || new Audio(); media = activeMedia;
@@ -103,18 +108,26 @@
         if (activeMedia.ended || !activeMedia.paused) return;
         if (phase === 'playing') {wantsPlay = false; clearTimer(); phase = 'paused'; emit();}
       });
-      on('loadedmetadata', () => {duration = Number.isFinite(activeMedia.duration) ? activeMedia.duration : 0; emit();});
+      on('loadedmetadata', () => {
+        duration = Number.isFinite(activeMedia.duration) ? activeMedia.duration : 0;
+        if (seekOnLoad > 0 && seekOnLoad < duration - 0.5) {try {activeMedia.currentTime = seekOnLoad;} catch { /* ignore */ }}
+        seekOnLoad = 0; emit();
+      });
       on('durationchange', () => {duration = Number.isFinite(activeMedia.duration) ? activeMedia.duration : 0; emit();});
       on('timeupdate', () => {currentTime = activeMedia.currentTime || 0; emit();});
       on('error', () => {if (activeMedia.error) fail();});
       on('ended', () => {
         if (!wantsPlay || !activeMedia.ended) return;
         clearTimer();
+        let step = null;
         if (repetitions === 0 || repetitions > 1) {
           if (repetitions > 1) repetitions--;
-          playAt(verses[index].id, false);
-        } else if (settings.advance && index < verses.length - 1) playAt(verses[index + 1].id);
-        else {wantsPlay = false; phase = 'ended'; emit();}
+          step = {id: verses[index].id, reset: false};
+        } else if (settings.advance && index < lastIndex) step = {id: verses[index + 1].id, reset: true};
+        if (!step) {wantsPlay = false; phase = 'ended'; emit(); return;}
+        const go = () => {gapTimer = null; pending = null; if (!disposed) playAt(step.id, step.reset);};
+        if (gapMs() <= 0) go();
+        else {pending = step; gapTimer = setTimeout(go, gapMs());}
       });
       try {activeMedia.src = urlFor(verses[index]); startMedia();} catch {fail();}
     }
@@ -124,11 +137,12 @@
     }
     function pause() {
       if (!media || disposed) return;
-      wantsPlay = false; playRequest++; clearTimer(); media.pause(); phase = 'paused'; emit();
+      wantsPlay = false; playRequest++; clearTimer(); clearTimeout(gapTimer); gapTimer = null; media.pause(); phase = 'paused'; emit();
     }
     function stop() {detach(); phase = 'stopped'; currentTime = 0; duration = 0; emit();}
     function toggle() {
       if (phase === 'playing' || phase === 'loading') pause();
+      else if (pending && phase === 'paused') {const step = pending; pending = null; playAt(step.id, step.reset);}
       else if (media && ['paused','blocked'].includes(phase)) startMedia();
       else playAt(verses[index].id);
     }
@@ -138,6 +152,7 @@
       if (c.rates.includes(patch.rate)) settings.rate = patch.rate;
       if (c.repeat_options.some(r => r.value === patch.repeat)) {settings.repeat = patch.repeat;repetitions = patch.repeat;}
       if (typeof patch.advance === 'boolean') settings.advance = patch.advance;
+      if ((c.gap_options || []).some(g => g.value === patch.gap)) settings.gap = patch.gap;
       if (oldReciter !== settings.reciter) {stop(); if (running) playAt(verses[index].id);}
       if (media) media.playbackRate = settings.rate;
       let stored = true;
@@ -149,13 +164,19 @@
         try {media.currentTime = Math.min(duration, Math.max(0, seconds));currentTime = media.currentTime;emit();} catch { /* Metadata may be changing. */ }
       }
     }
-    return {playAt, select, pause, stop, toggle, configure, seek, snapshot,
+    function resumeFrom(point) {
+      if (!point || !byId.has(point.verseId)) return;
+      if (c.reciters.some(r => r.id === point.reciter) && point.reciter !== settings.reciter) configure({reciter:point.reciter});
+      playAt(point.verseId);
+      seekOnLoad = Number.isFinite(point.time) ? point.time : 0;
+    }
+    return {playAt, select, pause, stop, toggle, configure, seek, snapshot, resumeFrom,
       playContinuous: () => {configure({advance:true,repeat:1});playAt(verses[index].id);},
       previous: () => {if (index > 0) playAt(verses[index - 1].id);},
-      next: () => {if (index < verses.length - 1) playAt(verses[index + 1].id);},
+      next: () => {if (index < lastIndex) playAt(verses[index + 1].id);},
       dispose: () => {disposed = true;detach(true);}};
   }
-  async function mount(host, {verses, surahs, initialId, onState, isActive = () => host.isConnected}) {
+  async function mount(host, {verses, surahs, initialId, endId, onState, isActive = () => host.isConnected}) {
     const c = await configuration();
     if (!isActive()) return null;
     const ui = c.ui, wrap = element('section', null, 'quran-audio'); wrap.setAttribute('aria-label',ui.title);
@@ -171,34 +192,44 @@
     const reciter = select(ui.reciter,c.reciters.map(r=>[r.id,r.name]),value=>set({reciter:value}));
     const rate = select(ui.rate,c.rates.map(r=>[r,r+'×']),value=>set({rate:Number(value)}));
     const repeat = select(ui.repeat,c.repeat_options.map(r=>[r.value,r.label]),value=>set({repeat:Number(value)}));
+    const gap=select(ui.gap||'الفاصل بين الآيات',(c.gap_options||[{value:250,label:'ربع ثانية'}]).map(g=>[g.value,g.label]),value=>set({gap:Number(value)}));
     const advanceLabel=element('label',ui.advance), advance=element('input');advance.type='checkbox';
     advance.addEventListener('change',()=>set({advance:advance.checked}));advanceLabel.prepend(advance);
     const actions=element('div',null,'quran-audio-actions');
     const previous=button(ui.previous,()=>player.previous()), play=button(ui.play,()=>player.toggle());
     const stop=button(ui.stop,()=>player.stop()), next=button(ui.next,()=>player.next());actions.append(previous,play,stop,next);
     const continuous=button(ui.play_continuous,()=>player.playContinuous());
-    const current=element('p',null,'quran-meta'), state=element('p',null,'quran-meta');state.setAttribute('role','status');
+    const current=element('p',null,'quran-meta'), state=element('p',null,'quran-meta');
+    state.setAttribute('aria-live','off');
+    const announcer=element('p',null,'quran-sr-only');announcer.setAttribute('role','status');announcer.setAttribute('aria-live','polite');announcer.setAttribute('aria-atomic','true');
     const seekLabel=element('label',ui.seek), seek=element('input');seek.type='range';seek.min=0;seek.max=0;seek.step=0.1;seek.value=0;seek.disabled=true;
     seek.addEventListener('change',()=>player.seek(Number(seek.value)));seekLabel.append(seek);
-    const clock=element('output');clock.dir='ltr';
-    const time=s=>Math.floor(s/60)+':'+String(Math.floor(s%60)).padStart(2,'0');
+    const clock=element('output');clock.dir='ltr';clock.setAttribute('role','timer');clock.setAttribute('aria-live','off');
+    const time=s=>(s=Number.isFinite(s)?s:0,Math.floor(s/60))+':'+String(Math.floor(s%60)).padStart(2,'0');
     const source=element('a',ui.source);source.href=c.source.url;source.target='_blank';source.rel='noopener noreferrer';source.className='quran-meta';
     let lastStatus='';
     player=createPlayer(c,verses,s=>{
       if (!isActive()) return;
       reciter.value=s.settings.reciter;rate.value=s.settings.rate;repeat.value=s.settings.repeat;advance.checked=s.settings.advance;
-      current.textContent=interpolate(ui.current,{surah:surahs[s.verse.surah-1].name,ayah:s.verse.ayah});
-      if (lastStatus !== s.phase) {state.textContent=ui[s.phase]||ui.idle;lastStatus=s.phase;}
+      const label=interpolate(ui.current,{surah:surahs[s.verse.surah-1].name,ayah:s.verse.ayah});
+      if (current.textContent!==label) current.textContent=label;
+      gap.value=s.settings.gap;
+      if (lastStatus !== s.phase) {
+        state.textContent=ui[s.phase]||ui.idle;lastStatus=s.phase;
+        // Spoken only for states the person must know about; not on every verse change.
+        announcer.textContent=['paused','stopped','ended','error','blocked'].includes(s.phase)?(ui[s.phase]||''):'';
+      }
       play.textContent=['playing','loading'].includes(s.phase)?ui.pause:s.phase==='paused'?ui.resume:ui.play;
       previous.disabled=s.verse.id===verses[0].id;next.disabled=s.verse.id===verses[verses.length-1].id;
       seek.max=s.duration;seek.disabled=s.duration<=0;
       if (document.activeElement!==seek) seek.value=s.currentTime;
-      clock.textContent=time(s.currentTime)+' / '+time(s.duration);
+      const clockText=time(s.currentTime)+' / '+time(s.duration);
+      clock.textContent=clockText;seek.setAttribute('aria-valuetext',clockText);
       onState(s);
-    });
+    },endId);
     const options=element('details'),summary=element('summary',ui.options);
     options.append(summary,controls,source);
-    wrap.append(current,continuous,actions,advanceLabel,seekLabel,clock,state,options,storageStatus);host.replaceChildren(wrap);
+    wrap.append(current,continuous,actions,advanceLabel,seekLabel,clock,state,announcer,options,storageStatus);host.replaceChildren(wrap);
     player.select(initialId);
     // Initialize controls even when the requested verse is already the first one.
     player.configure({});

quran_audio_registry.json

@@ -11,19 +11,86 @@
     "note": "Verse filenames use three digits for the surah and three for the ayah. Recordings are linked, not redistributed or licensed as part of AL-Khatma."
   },
   "reciters": [
-    {"id": "husary", "name": "محمود خليل الحصري", "folder": "Husary_128kbps"},
-    {"id": "minshawy", "name": "محمد صديق المنشاوي", "folder": "Minshawy_Murattal_128kbps"},
-    {"id": "abdulbasit", "name": "عبد الباسط عبد الصمد — مرتل", "folder": "Abdul_Basit_Murattal_192kbps"},
-    {"id": "sudais", "name": "عبد الرحمن السديس", "folder": "Abdurrahmaan_As-Sudais_192kbps"},
-    {"id": "shuraym", "name": "سعود الشريم", "folder": "Saood_ash-Shuraym_128kbps"},
-    {"id": "maher", "name": "ماهر المعيقلي", "folder": "MaherAlMuaiqly128kbps"},
-    {"id": "hudhaify", "name": "علي الحذيفي", "folder": "Hudhaify_128kbps"},
-    {"id": "dussary", "name": "ياسر الدوسري", "folder": "Yasser_Ad-Dussary_128kbps"}
+    {
+      "id": "husary",
+      "name": "محمود خليل الحصري",
+      "folder": "Husary_128kbps"
+    },
+    {
+      "id": "minshawy",
+      "name": "محمد صديق المنشاوي",
+      "folder": "Minshawy_Murattal_128kbps"
+    },
+    {
+      "id": "abdulbasit",
+      "name": "عبد الباسط عبد الصمد — مرتل",
+      "folder": "Abdul_Basit_Murattal_192kbps"
+    },
+    {
+      "id": "sudais",
+      "name": "عبد الرحمن السديس",
+      "folder": "Abdurrahmaan_As-Sudais_192kbps"
+    },
+    {
+      "id": "shuraym",
+      "name": "سعود الشريم",
+      "folder": "Saood_ash-Shuraym_128kbps"
+    },
+    {
+      "id": "maher",
+      "name": "ماهر المعيقلي",
+      "folder": "MaherAlMuaiqly128kbps"
+    },
+    {
+      "id": "hudhaify",
+      "name": "علي الحذيفي",
+      "folder": "Hudhaify_128kbps"
+    },
+    {
+      "id": "dussary",
+      "name": "ياسر الدوسري",
+      "folder": "Yasser_Ad-Dussary_128kbps"
+    }
   ],
-  "defaults": {"reciter": "husary", "rate": 1, "repeat": 1, "advance": true},
-  "rates": [0.75, 1, 1.25, 1.5],
-  "repeat_options": [{"value":1,"label":"مرة واحدة"},{"value":2,"label":"مرتان"},{"value":3,"label":"3 مرات"},{"value":5,"label":"5 مرات"},{"value":0,"label":"تكرار مستمر"}],
-  "limits": {"request_timeout_ms": 15000, "loading_timeout_ms": 30000},
+  "defaults": {
+    "reciter": "husary",
+    "rate": 1,
+    "repeat": 1,
+    "advance": true,
+    "gap_ms": 250
+  },
+  "rates": [
+    0.75,
+    1,
+    1.25,
+    1.5
+  ],
+  "repeat_options": [
+    {
+      "value": 1,
+      "label": "مرة واحدة"
+    },
+    {
+      "value": 2,
+      "label": "مرتان"
+    },
+    {
+      "value": 3,
+      "label": "3 مرات"
+    },
+    {
+      "value": 5,
+      "label": "5 مرات"
+    },
+    {
+      "value": 0,
+      "label": "تكرار مستمر"
+    }
+  ],
+  "limits": {
+    "request_timeout_ms": 15000,
+    "loading_timeout_ms": 30000
+  },
   "ui": {
     "title": "الاستماع",
     "options": "القارئ وخيارات التلاوة",
@@ -49,6 +116,29 @@
     "error": "تعذّر تشغيل المقطع. تحقق من الإنترنت أو اختر قارئًا آخر ثم اضغط تشغيل.",
     "blocked": "اضغط تشغيل لاستكمال التلاوة؛ المتصفح يحتاج ضغطة منك.",
     "storage_error": "تعذّر حفظ تفضيلات الصوت على هذا الجهاز.",
-    "source": "مصدر التلاوة: EveryAyah"
-  }
-}
+    "source": "مصدر التلاوة: EveryAyah",
+    "gap": "الفاصل بين الآيات"
+  },
+  "gap_options": [
+    {
+      "value": 0,
+      "label": "بدون فاصل"
+    },
+    {
+      "value": 250,
+      "label": "ربع ثانية"
+    },
+    {
+      "value": 500,
+      "label": "نصف ثانية"
+    },
+    {
+      "value": 1000,
+      "label": "ثانية"
+    },
+    {
+      "value": 2000,
+      "label": "ثانيتان"
+    }
+  ]
+}

quran_khatma.js

@@ -50,59 +50,77 @@
  function savePosition(ctx,kind,value){if(!settings||!ctx)return true;try{const s=read(),p=s.plan;if(p?.id!==ctx.planId||!valid(p))return true;const r=resolvedRange(p,ctx.dayIndex);if(!Number.isInteger(value.verseId)||value.verseId<r.startId||value.verseId>r.endId)return true;p.positions??={};p.positions[ctx.dayIndex]??={};p.positions[ctx.dayIndex][kind]=value;write(s);ctx.progress??={};ctx.progress[kind]=value;return true;}catch{return false;}}
  async function openReminder(item,{at,back}={}){const mode=item.openQuran===undefined?(item.type==='quran'?'wird':''):item.openQuran;if(mode==='wird')return openWird({at,back});return window.MuslimClockQuran.open({resumeReading:true,back});}
  async function sync(plan){if(typeof RegistryApp==='undefined'||!RegistryApp.syncQuranPlan)throw Error('reminder');RegistryApp.syncQuranPlan(plan,settings.ui.reminder_title);}
- async function show({back}={}){
+ async function show({back,message,focus}={}){
   const request=revision;let c;try{c=await ready();}catch{if(request===revision)await window.MuslimClockQuran.open({back,khatmaUnavailable:true});return;}
   if(request!==revision)return;
   const ui=c.ui,root=el('div');root.className='quran-khatma';let state;
+  // Persistent live region: it is never removed, so changes are always announced.
+  const status=el('p');status.setAttribute('role','status');status.setAttribute('aria-live','polite');status.setAttribute('aria-atomic','true');status.tabIndex=-1;
+  const view=el('div');
+  const say=(text,{moveFocus=false}={})=>{status.textContent='';setTimeout(()=>{status.textContent=text||'';if(moveFocus&&text)status.focus();},40);};
+  // After every re-render, put the screen reader on the new heading instead of losing its place.
+  const landOn=heading=>{heading.tabIndex=-1;setTimeout(()=>heading.focus(),60);};
   try{state=read();}catch{root.append(el('p',ui.storage_error));RegistryApp.openPanel('worship',{title:ui.title,compact:true},()=>document.getElementById('adaptivePopupBody').append(root));return;}
   const plan=valid(state.plan)?state.plan:null;
-  const status=el('p');status.setAttribute('role','status');
+  root.append(view,status);
   function rangeLabel(r,day){return fmt(ui.range_exact,{day,start:r.startKey,end:r.endKey,first:r.startPage,last:r.endPage});}
-  function paint(){root.replaceChildren();root.append(el('p',ui.note));
-   if(plan){root.append(el('p',plan.layout?fmt(ui.summary_exact,{days:plan.days,quantity:plan.amount||'',unit:source.partitions.units.find(u=>u.id===plan.unit)?.label||'',start:plan.startDate}):fmt(ui.summary,{days:plan.days,page:plan.startPage,start:plan.startDate})));if(!plan.layout)root.append(el('p',ui.legacy_note));
+  function paint(land=true){view.replaceChildren();
+   const h=el('h3',ui.plan_heading||ui.title);view.append(h,el('p',ui.note));
+   if(plan){view.append(el('p',plan.layout?fmt(ui.summary_exact,{days:plan.days,quantity:plan.amount||'',unit:source.partitions.units.find(u=>u.id===plan.unit)?.label||'',start:plan.startDate}):fmt(ui.summary,{days:plan.days,page:plan.startPage,start:plan.startDate})));if(!plan.layout)view.append(el('p',ui.legacy_note));
     const idx=current(plan),r=resolvedRange(plan,Math.max(0,Math.min(plan.days-1,idx)));
-    root.append(el('p',plan.paused?ui.paused:idx<0?ui.before:idx>=plan.days?ui.after:rangeLabel(r,idx+1)));
-    if(!plan.paused)root.append(button(ui.open,()=>openWird({back:()=>show({back})})));
-    const label=el('label',ui.choose_day),select=el('select');for(let i=0;i<plan.days;i++){const r=resolvedRange(plan,i),o=el('option',rangeLabel(r,i+1));o.value=i;select.append(o);}select.value=Math.max(0,Math.min(plan.days-1,idx));label.append(select);root.append(label,button(ui.open,async()=>{const dayIndex=Number(select.value),r=resolvedRange(plan,dayIndex);window.MuslimClockQuran.open({wird:{planId:plan.id,dayIndex,...r,progress:plan.positions?.[dayIndex]||{}},page:r.startPage,back:()=>show({back})});}));
-    root.append(button(plan.paused?ui.resume:ui.stop,async()=>{try{const s=read();s.plan.paused=!s.plan.paused;write(s);try{await sync(s.plan);}catch{status.textContent=ui.reminder_error;return;}show({back});}catch{status.textContent=ui.storage_error;}}));
-    root.append(button(ui.edit,()=>form(plan)),button(ui.new,()=>form(null)));
-   }else {root.append(el('p',ui.empty));form(null);return;}
-   root.append(status);
+    view.append(el('p',plan.paused?ui.paused:idx<0?ui.before:idx>=plan.days?ui.after:rangeLabel(r,idx+1)));
+    if(!plan.paused)view.append(button(ui.open,()=>openWird({back:()=>show({back})})));
+    const label=el('label',ui.choose_day),select=el('select');for(let i=0;i<plan.days;i++){const rr=resolvedRange(plan,i),o=el('option',rangeLabel(rr,i+1));o.value=i;select.append(o);}select.value=Math.max(0,Math.min(plan.days-1,idx));label.append(select);
+    view.append(label,button(ui.open_selected||ui.open,async()=>{const dayIndex=Number(select.value),rr=resolvedRange(plan,dayIndex);window.MuslimClockQuran.open({wird:{planId:plan.id,dayIndex,...rr,progress:plan.positions?.[dayIndex]||{}},page:rr.startPage,back:()=>show({back})});}));
+    view.append(button(plan.paused?ui.resume:ui.stop,async()=>{try{const s=read();s.plan.paused=!s.plan.paused;write(s);try{await sync(s.plan);}catch{say(ui.reminder_error,{moveFocus:true});return;}show({back,message:s.plan.paused?ui.stopped_done:ui.resumed_done});}catch{say(ui.storage_error,{moveFocus:true});}}));
+    view.append(button(ui.edit,()=>form(plan)),button(ui.new,()=>form(null)));
+   }else {view.append(el('p',ui.empty));form(null,land);return;}
+   if(land)landOn(h);
   }
-  function form(old){root.replaceChildren(el('p',ui.note));
-   function field(name,type,value){const l=el('label',ui[name]),input=el('input');input.type=type;input.value=value;l.append(input);root.append(l);return input;}
+  function form(old,land=true){view.replaceChildren();
+   const h=el('h3',old?ui.edit:ui.new);view.append(h,el('p',ui.note));
+   const described=(input,text,id)=>{const d=el('p',text);d.id=id;d.className='quran-meta';input.setAttribute('aria-describedby',id);return d;};
+   function field(name,type,value,hintText){const l=el('label',ui[name]),input=el('input');input.type=type;input.value=value;l.append(input);view.append(l);if(hintText){const d=described(input,hintText,'khatma-hint-'+name);l.append(d);}return input;}
    const unitLabel=el('label',ui.unit),unit=el('select');
    if(old&&!old.layout){const opt=el('option',ui.legacy_note);opt.value='legacy_pages';unit.append(opt);}
-   for(const u of source.partitions.units){const opt=el('option',u.label);opt.value=u.id;unit.append(opt);}unit.value=old?(old.layout?old.unit:'legacy_pages'):'balanced_pages';unitLabel.append(unit);root.append(unitLabel);
-   const days=field('days','number',old?.days??c.defaults.days);days.min=1;days.max=6236;days.step=1;
-   const start=field('start','date',old?.startDate??dateKey()),page=field('page','number',old?.startPage??c.defaults.start_page);page.min=1;page.max=604;page.step=1;
-   const amount=field('amount','number',old?.amount??1),startUnit=field('unit_start','number',old?.startUnit??1);amount.min=startUnit.min=1;amount.step=startUnit.step=1;
+   for(const u of source.partitions.units){const opt=el('option',u.label);opt.value=u.id;unit.append(opt);}unit.value=old?(old.layout?old.unit:'legacy_pages'):'balanced_pages';unitLabel.append(unit);view.append(unitLabel);
+   const days=field('days','number',old?.days??c.defaults.days);days.min=1;days.max=6236;days.step=1;days.inputMode='numeric';
+   const start=field('start','date',old?.startDate??dateKey(),ui.date_hint);
+   const page=field('page','number',old?.startPage??c.defaults.start_page);page.min=1;page.max=604;page.step=1;page.inputMode='numeric';
+   const amount=field('amount','number',old?.amount??1),startUnit=field('unit_start','number',old?.startUnit??1);amount.min=startUnit.min=1;amount.step=startUnit.step=1;amount.inputMode=startUnit.inputMode='numeric';
    const customStart=field('custom_start','text',old?.startKey??'1:1'),customEnd=field('custom_end','text',old?.endKey??'114:6');customStart.dir=customEnd.dir='ltr';
-   const hint=el('p',ui.custom_hint);root.append(hint);
-   function controls(){const balanced=['balanced_pages','legacy_pages'].includes(unit.value),custom=unit.value==='custom',u=source.partitions.units.find(u=>u.id===unit.value);days.parentElement.hidden=!balanced&&!custom;page.parentElement.hidden=!balanced;amount.parentElement.hidden=startUnit.parentElement.hidden=balanced||custom;customStart.parentElement.hidden=customEnd.parentElement.hidden=hint.hidden=!custom;if(u){amount.max=startUnit.max=u.count;}status.textContent='';}
-   unit.onchange=controls;controls();
+   const hint=el('p',ui.custom_hint);view.append(hint);
+   function controls(){const balanced=['balanced_pages','legacy_pages'].includes(unit.value),custom=unit.value==='custom',u=source.partitions.units.find(u=>u.id===unit.value);days.parentElement.hidden=!balanced&&!custom;page.parentElement.hidden=!balanced;amount.parentElement.hidden=startUnit.parentElement.hidden=balanced||custom;customStart.parentElement.hidden=customEnd.parentElement.hidden=hint.hidden=!custom;if(u){amount.max=startUnit.max=u.count;amount.setAttribute('aria-description',fmt(ui.range_hint||'',{max:u.count}));startUnit.setAttribute('aria-description',fmt(ui.range_hint||'',{max:u.count}));}say('');}
+   unit.onchange=()=>{controls();say(fmt(ui.fields_changed||'',{unit:unit.selectedOptions[0]?.textContent||''}));};controls();
    const reminder=field('reminder','checkbox','');reminder.checked=old?.reminder===true;
-   const time=field('time','time',old?.time??c.defaults.reminder_time);
-   root.append(el('p',ui.scope),button(ui.save,async()=>{
+   const time=field('time','time',old?.time??c.defaults.reminder_time,ui.time_hint);
+   view.append(el('p',ui.scope));
+   const fail=(text,input)=>{say(text,{moveFocus:false});setTimeout(()=>{(input||status).focus();},80);};
+   view.append(button(ui.save,async()=>{
+    if(!start.value){fail(ui.invalid,start);return;}
     const next={id:old?.id||('khatma-'+Date.now().toString(36)),days:Number(days.value),startDate:start.value,startPage:Number(page.value),time:time.value,reminder:reminder.checked,paused:false,positions:old?.positions||{}};
     if(unit.value!=='legacy_pages'){
      next.layout=source.partitions.revision;next.unit=unit.value;
      if(unit.value==='custom'){next.startKey=customStart.value.trim();next.endKey=customEnd.value.trim();next.startPage=source.byKey.get(next.startKey)?.page;}
      else if(unit.value!=='balanced_pages'){
       const u=source.partitions.units.find(u=>u.id===unit.value);next.amount=Number(amount.value);next.startUnit=Number(startUnit.value);
-      if(!u||!Number.isInteger(next.startUnit)||next.startUnit<1||next.startUnit>u.count||!Number.isInteger(next.amount)||next.amount<1||next.amount>u.count){status.textContent=ui.invalid;return;}
+      if(!u||!Number.isInteger(next.startUnit)||next.startUnit<1||next.startUnit>u.count||!Number.isInteger(next.amount)||next.amount<1||next.amount>u.count){fail(ui.invalid,amount);return;}
       next.days=Math.ceil((u.count-next.startUnit+1)/next.amount);next.startPage=source.verses[unitRange(next.unit,next.startUnit).startId-1].page;
      }
     }
-    if(!valid(next)){status.textContent=ui.invalid;return;}
+    if(!valid(next)){fail(ui.invalid,days);return;}
     const reset=plan&&(!old||['days','startDate','startPage','layout','unit','amount','startUnit','startKey','endKey'].some(k=>plan[k]!==next[k]));
     if(reset&&!window.confirm(ui.replace_confirm))return;if(reset)next.positions={};
-    try{const s=read();s.plan=next;write(s);}catch{status.textContent=ui.storage_error;return;}
-    try{await sync(next);}catch{status.textContent=ui.reminder_error;return;}
-    show({back});
-   }),status);
+    try{const s=read();s.plan=next;write(s);}catch{fail(ui.storage_error);return;}
+    try{await sync(next);}catch{fail(ui.reminder_error);return;}
+    show({back,message:ui.saved});
+   }));
+   if(plan)view.append(button(ui.cancel||ui.back,()=>{paint();say(ui.cancelled||'');}));
+   if(land)landOn(h);
   }
-  RegistryApp.openPanel('worship',{title:ui.title,compact:true},()=>{document.getElementById('adaptivePopupBody').append(root);if(back)document.getElementById('adaptivePopupActions').append(button(ui.back,back));});paint();
+  RegistryApp.openPanel('worship',{title:ui.title,compact:true},()=>{document.getElementById('adaptivePopupBody').append(root);if(back)document.getElementById('adaptivePopupActions').append(button(ui.back,back));});
+  paint(!message);
+  if(message){const heading=view.querySelector('h3');if(heading)landOn(heading);say(message);}
  }
  window.MuslimClockKhatma=Object.freeze({configuration,show,openWird,openReminder,savePosition,context,range,dateKey,dayNumber});
 })();

quran_khatma_registry.json

@@ -43,6 +43,16 @@
     "retry": "إعادة المحاولة",
     "load_error": "تعذّر تحميل إعدادات الختمة.",
     "choose_day": "عرض ورد يوم آخر",
-    "scope": "التذكير يستخدم نظام الساعة المحلي الحالي؛ لا يضمن التنبيه بعد إغلاق المتصفح."
+    "scope": "التذكير يستخدم نظام الساعة المحلي الحالي؛ لا يضمن التنبيه بعد إغلاق المتصفح.",
+    "plan_heading": "خطة الختمة",
+    "open_selected": "فتح ورد اليوم المحدد في القائمة",
+    "cancel": "إلغاء التعديل والعودة للخطة",
+    "cancelled": "أُلغي التعديل.",
+    "stopped_done": "أُوقفت الخطة وتذكيرها.",
+    "resumed_done": "استؤنفت الخطة.",
+    "date_hint": "أدخل التاريخ بصيغة سنة-شهر-يوم، مثل 2026-10-15، أو استخدم منتقي التاريخ.",
+    "time_hint": "أدخل الوقت بصيغة ساعات:دقائق بنظام 24 ساعة، مثل 18:00.",
+    "range_hint": "الحد الأعلى {max}.",
+    "fields_changed": "تغيّرت الحقول حسب الطريقة المختارة: {unit}."
   }
-}
+}

quran_reader.css

@@ -47,13 +47,13 @@
 #adaptivePopupBody .quran-nav button{flex:1;text-align:center;min-width:0}
 #adaptivePopupBody .quran-reader button:disabled{opacity:.5;cursor:default}
 #adaptivePopupBody .quran-page-title{font-size:1.15rem;text-align:center;margin:18px 0 8px}
-#adaptivePopupBody .quran-page-text{font-family:"Noto Naskh Arabic","Amiri",serif;font-size:var(--quran-font-size,26px);line-height:2.3;margin:8px 0;overflow-wrap:break-word}
+#adaptivePopupBody .quran-page-text{font-size:var(--quran-font-size,26px);margin:8px 0}
 #adaptivePopupBody .quran-verse{scroll-margin-block:20px}
 #adaptivePopupBody .quran-verse:focus{outline:2px solid currentColor;outline-offset:3px;border-radius:3px}
 #adaptivePopupBody .quran-verse-number{font-family:inherit;font-size:.8em;white-space:nowrap}
-#adaptivePopupBody .quran-basmala{text-align:center;font-family:"Noto Naskh Arabic","Amiri",serif;font-size:var(--quran-font-size,26px);line-height:2}
+#adaptivePopupBody .quran-basmala{text-align:center;font-size:var(--quran-font-size,26px)}
 #adaptivePopupBody .quran-meta{font-size:.85rem;line-height:1.6;margin:10px 0}
-#adaptivePopupBody .quran-result-text{display:block;font-family:"Noto Naskh Arabic","Amiri",serif;font-size:var(--quran-font-size,26px);line-height:2}
+#adaptivePopupBody .quran-result-text{display:block;font-size:var(--quran-font-size,26px)}
 #adaptivePopupBody .quran-settings input[type="range"]{width:100%;padding:0;min-height:44px}
 #adaptivePopupBody .quran-settings input[type="checkbox"]{width:auto}
 #adaptivePopupCard[data-quran-theme]{background:var(--quran-bg);color:var(--quran-fg);border-color:var(--quran-border);color-scheme:light}
@@ -86,3 +86,22 @@
  #adaptivePopupBody .quran-nav button{font-size:14px;padding:8px}
  #adaptivePopupBody .quran-toolbar{gap:6px}
 }
+
+
+/* ===== إضافات: روابط التفسير وأسباب النزول ومعاني الكلمات + إتاحة قارئ الشاشة ===== */
+.quran-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
+#adaptivePopupBody .quran-link-group{margin:6px 0}
+#adaptivePopupBody .quran-link-group summary{cursor:pointer;min-height:44px;padding:10px 0;font-weight:bold}
+#adaptivePopupBody .quran-link-list{list-style:none;margin:0;padding:0}
+#adaptivePopupBody .quran-link-list li{margin:0}
+#adaptivePopupBody .quran-link-list a{display:block;min-height:44px;padding:10px 4px;text-decoration:underline;overflow-wrap:anywhere}
+#adaptivePopupBody .quran-khatma h3[tabindex="-1"]:focus,
+#adaptivePopupBody .quran-khatma p[tabindex="-1"]:focus{outline:2px solid currentColor;outline-offset:3px}
+#adaptivePopupBody .quran-khatma button,
+#adaptivePopupBody .quran-khatma input,
+#adaptivePopupBody .quran-khatma select{min-height:44px}
+#adaptivePopupBody .quran-khatma [hidden]{display:none!important}
+#adaptivePopupBody .quran-khatma :focus-visible,
+#adaptivePopupBody .quran-ayah-actions :focus-visible,
+#adaptivePopupBody .quran-audio :focus-visible{outline:2px solid currentColor;outline-offset:2px}
+@media (prefers-reduced-motion:reduce){#adaptivePopupBody *{scroll-behavior:auto!important;transition:none!important}}

quran_reader.js

@@ -227,11 +227,11 @@
     let audioAttempt = 0;
     cleanup = () => {saveAudio(player?.snapshot(),true);mounted=false;audioAttempt++;player?.dispose();window.removeEventListener('pagehide',flushAudio);document.removeEventListener('visibilitychange',flushAudio);};
     const toolbar = node('div', null, 'quran-toolbar');
-    const navigator = node('details', null, 'quran-navigator');
+    const navPanel = node('details', null, 'quran-navigator');
     const navigatorTitle = node('summary', ui.navigate);
     const navigatorGrid = node('div', null, 'quran-navigator-grid');
-    navigator.append(navigatorTitle, navigatorGrid);
-    toolbar.append(navigator);
+    navPanel.append(navigatorTitle, navigatorGrid);
+    toolbar.append(navPanel);
     const field = (label, input) => { const wrap = node('label', label); wrap.append(input); navigatorGrid.append(wrap); return input; };
     const select = (items, label) => {
       const input = node('select');
@@ -243,13 +243,20 @@
     const surahSearchLabel=node('label',ui.search_surah);surahSearchLabel.append(surahSearch);
     navigatorGrid.insertBefore(surahSearchLabel,surahSelect.parentElement);
     surahSearch.addEventListener('input',()=>{
-      const term=normalize(surahSearch.value);
-      for(const option of surahSelect.options) option.hidden=Boolean(term)&&!normalize(option.textContent).includes(term);
+      const term=normalize(surahSearch.value),keep=surahSelect.value;
+      surahSelect.replaceChildren();
+      for(const sr of source.surahs){
+        const text=sr.id+'. '+sr.name;
+        if(term&&!normalize(text).includes(term))continue;
+        const option=node('option',text);option.value=sr.id;surahSelect.append(option);
+      }
+      if([...surahSelect.options].some(o=>o.value===keep))surahSelect.value=keep;
+      status.textContent=surahSelect.options.length?'':ui.no_results;
     });
     const juzSelect = select(Array.from({length: source.counts.juz}, (_, i) => [i + 1, i + 1]), ui.juz);
     const hizbSelect=select(source.partitions.hizb.map(r=>[r.id,r.id]),ui.hizb);
     const rubSelect=select(source.partitions.rub_el_hizb.map(r=>[r.id,r.id]),ui.rub_el_hizb);
-    const position=node('p',null,'quran-meta');position.setAttribute('aria-live','polite');
+    const position=node('p',null,'quran-meta');position.setAttribute('aria-live','off');
     function positionText(v){return format(ui.partition_position,{juz:v.juz,hizb:v.hizb,rub:v.rub_el_hizb,page:v.page});}
     const pageForm = node('form');
     const pageLabel = node('label', ui.page);
@@ -284,16 +291,31 @@
       const planOK=window.MuslimClockKhatma?.savePosition(wird,'reading',point)!==false;
       actionStatus.textContent=ok&&planOK?ui.bookmark_saved:ui.progress_error;updateBookmarks();
     });
-    const tafsir=node('details'),tafsirTitle=node('summary',ui.tafsir),tafsirLinks=node('div',null,'quran-tafsir-links');
-    tafsir.append(tafsirTitle,node('p',ui.tafsir_note,'quran-meta'),tafsirLinks);
-    actions.append(actionTitle,listen,copy,bookmark,tafsir,button(ui.close_actions,()=>{actions.hidden=true;actionOrigin?.focus();}),actionStatus);
+    const linkGroups=[
+      {key:'tafsir',items:c.tafsirs,note:'tafsir_note'},
+      {key:'asbab',items:c.asbab_nuzul,note:'asbab_note'},
+      {key:'meanings',items:c.word_meanings,note:'meanings_note'}
+    ].filter(g=>Array.isArray(g.items)&&g.items.length).map(g=>{
+      const box=node('details',null,'quran-link-group'),title=node('summary',ui[g.key]),list=node('ul',null,'quran-link-list');
+      box.append(title,node('p',ui[g.note],'quran-meta'),list);return {...g,box,list};
+    });
+    actions.append(actionTitle,listen,copy,bookmark,...linkGroups.map(g=>g.box),button(ui.close_actions,()=>{actions.hidden=true;actionOrigin?.focus();}),actionStatus);
+    function fillLinks(verse){
+      for(const g of linkGroups){
+        g.list.replaceChildren();g.box.open=false;
+        for(const item of g.items){
+          try{
+            const url=new URL(format(item.url,{surah:verse.surah,ayah:verse.ayah}));if(url.protocol!=='https:')continue;
+            const li=node('li'),link=node('a',item.name+' ↗');link.href=url.href;link.target='_blank';link.rel='noopener noreferrer';
+            link.setAttribute('aria-label',ui[g.key]+' — '+source.surahs[verse.surah-1].name+' '+ui.ayah+' '+verse.ayah+' — '+item.name+' — '+ui.external_link);
+            link.addEventListener('click',()=>player?.pause());li.append(link);g.list.append(li);
+          }catch{}
+        }
+      }
+    }
     function selectVerse(verse, origin) {
       actionVerse=verse;actionOrigin=origin;
-      tafsirLinks.replaceChildren();tafsir.open=false;
-      for(const item of c.tafsirs||[]){
-        try{const url=new URL(format(item.url,{surah:verse.surah,ayah:verse.ayah}));if(url.protocol!=='https:')continue;
-        const link=node('a',item.name+' ↗');link.href=url.href;link.target='_blank';link.rel='noopener noreferrer';link.addEventListener('click',()=>player?.pause());tafsirLinks.append(link);}catch{}
-      }
+      fillLinks(verse);
       actionTitle.textContent=source.surahs[verse.surah-1].name+' · '+ui.ayah+' '+verse.ayah+' · '+positionText(verse);
       actionStatus.replaceChildren();actions.hidden=false;(listen.disabled?copy:listen).focus();
     }
@@ -401,7 +423,7 @@
         }
         const span = node('span', verse.text, 'quran-verse');
         span.id = 'quran-verse-' + verse.id; span.tabIndex = 0;span.setAttribute('role','button');
-        span.setAttribute('aria-label',verse.text+' · '+ui.ayah+' '+verse.ayah+' · '+ui.verse_actions);
+        span.setAttribute('aria-label',verse.text+' — '+ui.ayah+' '+verse.ayah+' — '+ui.verse_actions);span.setAttribute('aria-haspopup','true');
         span.addEventListener('click',()=>selectVerse(verse,span));
         span.addEventListener('keydown',event=>{if(event.key==='Enter'||event.key===' '){event.preventDefault();selectVerse(verse,span);}});
         const number = node('span', ' (' + verse.ayah + ') ', 'quran-verse-number');

quran_reader_registry.json

@@ -3,12 +3,38 @@
   "core_file": "quran_core_registry.json",
   "source_file": "al_khatma_source_attribution.md",
   "storage_key": "muslim_clock_quran_reader_v1",
-  "defaults": {"font_size": 26, "remember_page": true, "theme": "auto", "follow_audio": true},
+  "defaults": {
+    "font_size": 26,
+    "remember_page": true,
+    "theme": "auto",
+    "follow_audio": true,
+    "show_partition_status": true,
+    "show_swipe_hint": true
+  },
   "themes": {
-    "light": {"bg":"#ffffff","fg":"#19241d","surface":"#f1f5f2","border":"#7b8980","highlight":"#c5e9d0","highlight_fg":"#102b1a"},
-    "dark": {"bg":"#171b18","fg":"#f0f5f1","surface":"#252c27","border":"#87978c","highlight":"#365a40","highlight_fg":"#ffffff"}
+    "light": {
+      "bg": "#ffffff",
+      "fg": "#19241d",
+      "surface": "#f1f5f2",
+      "border": "#7b8980",
+      "highlight": "#c5e9d0",
+      "highlight_fg": "#102b1a"
+    },
+    "dark": {
+      "bg": "#171b18",
+      "fg": "#f0f5f1",
+      "surface": "#252c27",
+      "border": "#87978c",
+      "highlight": "#365a40",
+      "highlight_fg": "#ffffff"
+    }
+  },
+  "limits": {
+    "font_min": 20,
+    "font_max": 40,
+    "search_batch": 40,
+    "request_timeout_ms": 30000
   },
-  "limits": {"font_min": 20, "font_max": 40, "search_batch": 40, "request_timeout_ms": 30000},
   "ui": {
     "title": "القرآن الكريم",
     "open": "قراءة القرآن الكريم",
@@ -52,6 +78,66 @@
     "close_actions": "إغلاق إجراءات الآية",
     "audio_loading": "جارٍ تجهيز مشغل التلاوة…",
     "audio_unavailable": "تعذّر تجهيز الصوت. القراءة متاحة؛ أعد محاولة تحميل المشغّل.",
-    "search_surah": "بحث عن سورة"
-  }
-}
+    "search_surah": "بحث عن سورة",
+    "navigate": "التنقل بين السور والأجزاء والصفحات",
+    "settings_short": "الإعدادات",
+    "bookmark": "حفظ علامة قراءة هنا",
+    "bookmark_saved": "حُفظت علامة القراءة عند هذه الآية.",
+    "progress_error": "تعذّر حفظ موضعك على هذا الجهاز.",
+    "tafsir": "التفسير",
+    "tafsir_note": "روابط خارجية تفتح على هذه الآية نفسها، وتتوقف التلاوة عند فتحها.",
+    "asbab": "أسباب النزول",
+    "asbab_note": "رابط خارجي يفتح على أسباب نزول هذه الآية. لا يوجد سبب نزول مروي لكل آية؛ إن لم يظهر شيء فالآية ليس لها سبب نزول مأثور.",
+    "meanings": "معاني الكلمات",
+    "meanings_note": "رابط خارجي يفتح على هذه الآية ويبيّن معنى كل كلمة.",
+    "external_link": "يفتح في نافذة جديدة",
+    "resume_reading": "المتابعة من علامة القراءة",
+    "resume_audio": "استكمال الاستماع من آخر موضع",
+    "khatma": "خطة الختمة وورد اليوم",
+    "reading_position": "علامة القراءة: {surah} · الآية {ayah} · الصفحة {page}",
+    "saved_page": "آخر صفحة محفوظة: {page}",
+    "audio_position": "آخر استماع: {surah} · الآية {ayah} · بعد {seconds} ثانية",
+    "quran_features_error": "تعذّر تحميل ميزات الختمة. القراءة متاحة.",
+    "wird_audio_end": "انتهى ورد اليوم.",
+    "wird_range": "ورد اليوم {day}: الصفحات {start}–{end}",
+    "wird_resume_audio": "استكمال الاستماع من آخر موضع في ورد اليوم",
+    "swipe_hint": "للتنقل بين الصفحات اسحب أفقيًا، أو استخدم زرَّي الصفحة السابقة والتالية.",
+    "show_partition_status": "إظهار موضع القراءة (الجزء والحزب والربع)",
+    "show_swipe_hint": "إظهار تلميح السحب بين الصفحات",
+    "verse_no": "الآية {ayah}",
+    "page_changed": "الصفحة {page}"
+  },
+  "progress_storage_key": "muslim_clock_quran_progress_v1",
+  "swipe": {
+    "min_distance_px": 70,
+    "horizontal_ratio": 2,
+    "max_duration_ms": 700,
+    "click_suppression_ms": 400
+  },
+  "tafsirs": [
+    {
+      "id": "quran_com_tafsir",
+      "name": "التفسير (Quran.com) — يفتح على هذه الآية",
+      "url": "https://quran.com/{surah}:{ayah}/tafsirs"
+    }
+  ],
+  "asbab_nuzul": [
+    {
+      "id": "altafsir_asbab",
+      "name": "أسباب النزول — التفسير الكبير (altafsir) لهذه الآية",
+      "url": "https://www.altafsir.com/AsbabAlnuzol.asp?SoraName={surah}&Ayah={ayah}&search=yes&img=A&LanguageID=1"
+    }
+  ],
+  "word_meanings": [
+    {
+      "id": "corpus_wbw",
+      "name": "معاني الكلمات كلمةً كلمة (Quranic Arabic Corpus)",
+      "url": "https://corpus.quran.com/wordbyword.jsp?chapter={surah}&verse={ayah}"
+    },
+    {
+      "id": "quran_com_verse",
+      "name": "صفحة ��لآية مع معاني الكلمات (Quran.com)",
+      "url": "https://quran.com/{surah}:{ayah}"
+    }
+  ]
+}