updating wird frontend

This commit is contained in:
2026-03-21 17:38:04 +00:00
parent 4d1ab5c244
commit 73ba1b3eb5
7 changed files with 1024 additions and 142 deletions

File diff suppressed because it is too large Load Diff

Binary file not shown.

View File

@@ -2,7 +2,7 @@
#+OPTIONS: toc:nil num:nil
* Recently Updated (top 26 files)
- [[file:home/wird-tracker.org][Wird Tracker]] @@html:<span class="post-date">2026-03-19 18:26</span>@@
- [[file:home/wird-tracker.org][Wird Tracker]] @@html:<span class="post-date">2026-03-21 17:34</span>@@
- [[file:blogs/2026/03-march/setting-a-wird-tracker-19-03.org][Setting a Wird Tracker]] @@html:<span class="post-date">2026-03-19 13:15</span>@@
- [[file:home/guide/wird-tracker-guide.org][Wird Tracker — Technical Guide]] @@html:<span class="post-date">2026-03-19 12:43</span>@@
- [[file:blogs/2026/03-march/fixing-the-dag-18-03.org][DAG fixes]] @@html:<span class="post-date">2026-03-18 15:01</span>@@

View File

@@ -22,6 +22,43 @@ This page tracks my daily awrād and spiritual practices.
<div id="wird-cards"></div>
</section>
<!-- Nafl Prayers Panel -->
<section id="nafl-panel" class="wird-panel">
<div class="wird-panel-header">
<h2>Nafl Prayers</h2>
</div>
<div id="nafl-cards">
<div class="nafl-card" id="nafl-salatul_tawbah">
<div class="nafl-icon">🤲</div>
<div class="nafl-name">Ṣalāt al-Tawbah</div>
<div class="nafl-sub">2 rakʿāt · repentance</div>
<button class="nafl-toggle" data-type="salatul_tawbah">Mark as prayed</button>
</div>
<div class="nafl-card" id="nafl-salatul_hajaat">
<div class="nafl-icon">🌙</div>
<div class="nafl-name">Ṣalāt al-Ḥājah</div>
<div class="nafl-sub">2 rakʿāt · need &amp; supplication</div>
<button class="nafl-toggle" data-type="salatul_hajaat">Mark as prayed</button>
</div>
<div class="nafl-card" id="nafl-tahajjud">
<div class="nafl-icon"></div>
<div class="nafl-name">Tahajjud</div>
<div class="nafl-sub">night vigil prayer</div>
<button class="nafl-toggle" data-type="tahajjud">Mark as prayed</button>
</div>
</div>
<div id="nafl-completion-bar-wrap">
<div id="nafl-bar-track">
<div id="nafl-completion-bar"></div>
</div>
<span id="nafl-completion-label">0 / 3 today</span>
</div>
</section>
<!-- Shaykh Meeting Panel -->
<section id="meeting-panel" class="wird-panel">
<div class="wird-panel-header">
@@ -33,72 +70,137 @@ This page tracks my daily awrād and spiritual practices.
</div>
</section>
<!-- Khatm Tracker -->
<section id="khatm-panel" class="wird-panel">
<div class="wird-panel-header">
<h2>Khatm — Qurʾān Completions</h2>
<button id="log-khatm-btn" class="btn-primary">+ Log Khatm</button>
</div>
<div id="khatm-stats-row">
<div class="stat-chip">
<span class="stat-val" id="khatm-total"></span>
<span class="stat-lbl">total khatms</span>
</div>
<div class="stat-chip">
<span class="stat-val" id="khatm-this-year"></span>
<span class="stat-lbl">this year</span>
</div>
<div class="stat-chip">
<span class="stat-val" id="khatm-avg-days"></span>
<span class="stat-lbl">avg days between</span>
</div>
<div class="stat-chip">
<span class="stat-val" id="khatm-last"></span>
<span class="stat-lbl">last completed</span>
</div>
</div>
<div id="khatm-list">
<p style="color:var(--muted);font-style:italic">Loading…</p>
</div>
</section>
<!-- Khatm Modal -->
<dialog id="khatm-modal">
<form id="khatm-form" method="dialog">
<h3>Log Khatm</h3>
<div class="modal-body">
<div class="field-group">
<label for="khatm-date">Date completed</label>
<input type="date" id="khatm-date" required>
</div>
<div class="field-group">
<label for="khatm-recitation">Recitation type <span class="optional">(optional)</span></label>
<select id="khatm-recitation">
<option value="">— select —</option>
<option value="tilawah">Tilāwah (reading)</option>
<option value="hifz">Ḥifẓ (memorisation)</option>
<option value="tadabbur">Tadabbur (reflection)</option>
</select>
</div>
<div class="field-group">
<label for="khatm-notes">Notes <span class="optional">(optional)</span></label>
<textarea id="khatm-notes" rows="3" placeholder="Any reflections…"></textarea>
</div>
</div>
<div id="khatm-modal-actions">
<button type="button" id="khatm-cancel">Cancel</button>
<button type="submit" class="btn-primary">Save</button>
</div>
</form>
</dialog>
<!-- Log Entry Modal -->
<dialog id="log-modal">
<form id="log-form" method="dialog">
<h3 id="modal-title">Log Entry</h3>
<div class="modal-body">
<div class="field-group">
<label for="log-date">Date</label>
<input type="date" id="log-date" required>
</div>
<div class="field-group">
<label for="log-type">Wird</label>
<select id="log-type" required>
<option value="durood">Durood</option>
<option value="istighfar">Istighfar</option>
<option value="quran">Qurʾān (juz)</option>
<option value="muraqabah">Murāqabah (min)</option>
<option value="wuqoof_qalbi">Wuqūf Qalbī</option>
<option value="shaykh_meeting" style="display:none">Meeting with Shaykh</option>
</select>
</div>
<!-- Numeric amount — count/juz/min wirds -->
<div class="field-group" id="value-group">
<label for="log-value">Amount</label>
<input type="number" id="log-value" min="0" step="0.5" placeholder="0">
</div>
<!-- Rating picker — wuqoof qalbi only -->
<div class="field-group" id="rating-group" style="display:none">
<label>Quality of presence</label>
<div class="modal-pips" id="modal-pips">
<button type="button" class="modal-pip" data-val="1">
<span class="pip-dot"></span>
<span class="pip-lbl">distracted</span>
</button>
<button type="button" class="modal-pip" data-val="2">
<span class="pip-dot"></span>
<span class="pip-lbl">scattered</span>
</button>
<button type="button" class="modal-pip" data-val="3">
<span class="pip-dot"></span>
<span class="pip-lbl">present</span>
</button>
<button type="button" class="modal-pip" data-val="4">
<span class="pip-dot"></span>
<span class="pip-lbl">attentive</span>
</button>
<button type="button" class="modal-pip" data-val="5">
<span class="pip-dot"></span>
<span class="pip-lbl">absorbed</span>
</button>
<div class="field-group">
<label for="log-date">Date</label>
<input type="date" id="log-date" required>
</div>
<input type="hidden" id="log-rating-value">
</div>
<!-- Shaykh meeting note -->
<div class="field-group" id="shaykh-group" style="display:none">
<p style="font-size:.82rem;color:var(--muted);margin:0">Set the date above to when the meeting took place.</p>
</div>
<div class="field-group">
<label for="log-type">Wird</label>
<select id="log-type" required>
<option value="durood">Durood</option>
<option value="istighfar">Istighfar</option>
<option value="quran">Qurʾān (juz)</option>
<option value="muraqabah">Murāqabah (min)</option>
<option value="wuqoof_qalbi">Wuqūf Qalbī</option>
<option value="shaykh_meeting" style="display:none">Meeting with Shaykh</option>
</select>
</div>
<div class="field-group">
<label for="log-notes">Notes <span class="optional">(optional)</span></label>
<textarea id="log-notes" rows="2" placeholder="Any reflections…"></textarea>
</div>
<!-- Numeric amount — count/juz/min wirds -->
<div class="field-group" id="value-group">
<label for="log-value">Amount</label>
<input type="number" id="log-value" min="0" step="0.5" placeholder="0">
</div>
<!-- Rating picker — wuqoof qalbi only -->
<div class="field-group" id="rating-group" style="display:none">
<label>Quality of presence</label>
<div class="modal-pips" id="modal-pips">
<button type="button" class="modal-pip" data-val="1">
<span class="pip-dot"></span>
<span class="pip-lbl">distracted</span>
</button>
<button type="button" class="modal-pip" data-val="2">
<span class="pip-dot"></span>
<span class="pip-lbl">scattered</span>
</button>
<button type="button" class="modal-pip" data-val="3">
<span class="pip-dot"></span>
<span class="pip-lbl">present</span>
</button>
<button type="button" class="modal-pip" data-val="4">
<span class="pip-dot"></span>
<span class="pip-lbl">attentive</span>
</button>
<button type="button" class="modal-pip" data-val="5">
<span class="pip-dot"></span>
<span class="pip-lbl">absorbed</span>
</button>
</div>
<input type="hidden" id="log-rating-value">
</div>
<!-- Shaykh meeting note -->
<div class="field-group" id="shaykh-group" style="display:none">
<p style="font-size:.85rem;color:var(--muted);margin:0">Set the date above to when the meeting took place.</p>
</div>
<div class="field-group">
<label for="log-notes">Notes <span class="optional">(optional)</span></label>
<textarea id="log-notes" rows="3" placeholder="Any reflections…"></textarea>
</div>
</div>
<div id="modal-actions">
<button type="button" id="modal-cancel">Cancel</button>
<button type="submit" id="modal-save" class="btn-primary">Save</button>
@@ -106,6 +208,112 @@ This page tracks my daily awrād and spiritual practices.
</form>
</dialog>
<!-- Mutāla'ah (Study) Panel -->
<section id="motalah-panel" class="wird-panel">
<div class="wird-panel-header">
<h2>Mutālaʿah — Study</h2>
<button id="log-motalah-btn" class="btn-primary">+ Log Session</button>
</div>
<!-- Today summary -->
<div id="motalah-today-row">
<div class="motalah-today-stat">
<span class="motalah-today-val" id="motalah-today-mins"></span>
<span class="motalah-today-lbl">min today</span>
</div>
<div class="motalah-today-stat">
<span class="motalah-today-val" id="motalah-streak"></span>
<span class="motalah-today-lbl">day streak</span>
</div>
<div class="motalah-today-stat">
<span class="motalah-today-val" id="motalah-total-hrs"></span>
<span class="motalah-today-lbl">hrs this month</span>
</div>
<div class="motalah-today-stat">
<span class="motalah-today-val" id="motalah-books-count"></span>
<span class="motalah-today-lbl">books touched</span>
</div>
</div>
<!-- Recent sessions -->
<div id="motalah-sessions-wrap">
<p style="color:var(--muted);font-style:italic">Loading…</p>
</div>
</section>
<!-- Mutāla'ah Log Modal -->
<dialog id="motalah-modal">
<form id="motalah-form" method="dialog">
<h3>Log Study Session</h3>
<div class="modal-body">
<div class="field-group">
<label for="motalah-date">Date</label>
<input type="date" id="motalah-date" required>
</div>
<div class="field-group">
<label for="motalah-duration">Duration (minutes)</label>
<input type="number" id="motalah-duration" min="1" step="1" placeholder="e.g. 45" required>
</div>
<div class="field-group">
<label>Books covered <span class="optional">(optional)</span></label>
<div class="book-search-wrap">
<span class="book-search-icon">🔍</span>
<input type="text" id="motalah-book-search" placeholder="Search your library…" autocomplete="off">
<div id="book-search-results"></div>
</div>
<div id="selected-books-chips"></div>
<!-- Hidden to carry selected IDs for JS -->
<select id="motalah-books" multiple style="display:none"></select>
</div>
<div class="field-group">
<label for="motalah-notes">Notes <span class="optional">(optional)</span></label>
<textarea id="motalah-notes" rows="3" placeholder="What did you cover?"></textarea>
</div>
</div>
<div id="motalah-modal-actions">
<button type="button" id="motalah-cancel">Cancel</button>
<button type="submit" id="motalah-save" class="btn-primary">Save</button>
</div>
</form>
</dialog>
<!-- Heatmap -->
<section id="heatmap-panel" class="wird-panel">
<div class="wird-panel-header">
<h2>Consistency</h2>
<select id="heatmap-type">
<option value="__all__">All wirds</option>
<option value="durood">Durood</option>
<option value="istighfar">Istighfar</option>
<option value="quran">Qurʾān</option>
<option value="muraqabah">Murāqabah</option>
<option value="wuqoof_qalbi">Wuqūf Qalbī</option>
<option value="nafl">Nafl prayers</option>
<option value="khatm">Khatm</option>
<option value="motalah">Mutālaʿah</option>
</select>
</div>
<div id="heatmap-wrap">
<div id="heatmap-month-labels"></div>
<div id="heatmap-grid"></div>
<div id="heatmap-legend">
<span class="hm-legend-lbl">less</span>
<span class="hm-swatch" data-level="0"></span>
<span class="hm-swatch" data-level="1"></span>
<span class="hm-swatch" data-level="2"></span>
<span class="hm-swatch" data-level="3"></span>
<span class="hm-swatch" data-level="4"></span>
<span class="hm-legend-lbl">more</span>
</div>
</div>
<div id="heatmap-stats"></div>
</section>
<!-- Trends -->
<section id="trends-panel" class="wird-panel">
<div class="wird-panel-header">
@@ -117,6 +325,7 @@ This page tracks my daily awrād and spiritual practices.
<option value="quran">Qurʾān</option>
<option value="muraqabah">Murāqabah</option>
<option value="wuqoof_qalbi">Wuqūf Qalbī</option>
<option value="motalah">Mutālaʿah</option>
</select>
<select id="trend-range">
<option value="14">14 days</option>
@@ -156,4 +365,4 @@ This page tracks my daily awrād and spiritual practices.
</div>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
#+END_EXPORT
#+END_EXPORT

View File

@@ -18,7 +18,7 @@ emacs -Q --script build-site.el
 WARN Clearing .org-timestamps/ and forcing full republish
── Tag generation ──────────────────────────────────────────────
 ✓ Tag pages written (11 tags)
 ◈ tag page generation took 1.12s
 ◈ tag page generation took 1.14s
── Publishing ──────────────────────────────────────────────────
 INFO SITE_FORCE=1 — forcing republish of all files
Resetting org-publish-cache
@@ -1530,9 +1530,9 @@ Resetting org-publish-cache
Generating sitemap for Lima
Publishing file /home/zaine/master-folder/org_files/org_web/lima/index.md using z/publish-lima-file
Publishing file /home/zaine/master-folder/org_files/org_web/lima/lima-list.org using z/publish-lima-file
 ◈ org-publish-all took 18.89s
 ◈ org-publish-all took 19.18s
── Build summary ───────────────────────────────────────────────
 ◈ Total elapsed : 20.46s
 ◈ Total elapsed : 20.77s
 ◈ HTML files output: 88
 ◈ CSS files output: 9
 ◈ JS files output: 11
@@ -1545,10 +1545,10 @@ Collecting beautifulsoup4
Using cached beautifulsoup4-4.14.3-py3-none-any.whl (107 kB)
Collecting lxml
Using cached lxml-6.0.2-cp310-cp310-manylinux_2_26_x86_64.manylinux_2_28_x86_64.whl (5.3 MB)
Collecting soupsieve>=1.6.1
Using cached soupsieve-2.8.3-py3-none-any.whl (37 kB)
Collecting typing-extensions>=4.0.0
Using cached typing_extensions-4.15.0-py3-none-any.whl (44 kB)
Collecting soupsieve>=1.6.1
Using cached soupsieve-2.8.3-py3-none-any.whl (37 kB)
Installing collected packages: typing-extensions, soupsieve, lxml, beautifulsoup4
Successfully installed beautifulsoup4-4.14.3 lxml-6.0.2 soupsieve-2.8.3 typing-extensions-4.15.0
Generating search index

View File

@@ -4,7 +4,7 @@
See the categories: @@html:<a href="../home/categories.html">Categories</a>@@
* Posts:
- [[file:career/career-list.org][Career List]] @@html:<span class="post-date">20-03-2026 23:55</span>@@
- [[file:career/career-list.org][Career List]] @@html:<span class="post-date">21-03-2026 17:37</span>@@
- [[file:career/ha-dr.org][High Availability, Disaster Recovery and Business Continuity]] @@html:<span class="post-date">11-03-2026 17:18</span>@@ @@html:<a href="/tags/learning.html"><span class="post-tag">learning</span></a>@@ @@html:<a href="/tags/notes.html"><span class="post-tag">notes</span></a>@@
- [[file:career/javascript.org][Understands the Javascript language]] @@html:<span class="post-date">11-03-2026 16:52</span>@@ @@html:<a href="/tags/learning.html"><span class="post-tag">learning</span></a>@@ @@html:<a href="/tags/notes.html"><span class="post-tag">notes</span></a>@@
- [[file:career/restful-api.org][Restful API]] @@html:<span class="post-date">15-02-2026 23:00</span>@@ @@html:<a href="/tags/learning.html"><span class="post-tag">learning</span></a>@@ @@html:<a href="/tags/notes.html"><span class="post-tag">notes</span></a>@@

View File

@@ -43,9 +43,9 @@
- [[file:tags/website.org][Tag: website]]
- [[file:tags/insights.org][Tag: insights]]
- [[file:tags/life.org][Tag: life]]
- [[file:tags/emacs.org][Tag: emacs]]
- [[file:tags/education.org][Tag: education]]
- [[file:tags/reading.org][Tag: reading]]
- [[file:tags/emacs.org][Tag: emacs]]
- [[file:tags/maths.org][Tag: maths]]
- home
- [[file:home/countdown.org][Countdown]]