رواية حفص عن عاصم — جميع السور الـ114 مع عشرات الحقول والإحصائيات، وصفحة رسوم بيانية، وصفحة أسئلة ومعلومات، ومسابقة تفاعلية ذكية.
إعداد وتطوير: م/ عامر الحلحلي
- نظرة عامة
- الصفحات الأربع
- المزايا
- التشغيل عبر المتصفح والتثبيت
- بنية المشروع
- صيغة البيانات والأعمدة
- الإعدادات الشاملة
- المسابقة
- دعم PWA (العمل دون إنترنت)
- التقنيات المستخدمة
- المساهمة والتصحيح
- الترخيص
قاعدة بيانات القرآن الكريم تطبيق ويب خفيف وسريع يعرض بيانات السور الـ114 في جدول تفاعلي قابل للبحث والفرز والتصفية، إلى جانب صفحة إحصائيات بيانية، وصفحة أسئلة ومعلومات، ومسابقة تفاعلية. يعمل بالكامل في المتصفح دون خادم خلفي، ويمكن تثبيته على الجوال كتطبيق (PWA) واستخدامه دون اتصال.
البيانات وفق رواية حفص عن عاصم، وتشمل عشرات الحقول لكل سورة: ترتيب النزول، الآيات/الكلمات/الحروف، الحروف المقطعة، السجدات، عدد ذكر «الله»، الأنبياء والأسماء الحسنى، الأرقام والألوان والحيوانات، أطول/أقصر آية، المتوسطات، الحروف الفريدة وغير المذكورة، تحليل الكلمات والجُمل، وبيانات إضافية من إحصاءات مصحف ١٤٤١ (أجزاء، أحزاب، صفحات، تشكيل...).
| الصفحة | الملف | الوصف |
|---|---|---|
| 📋 الجدول | index.html |
الجدول الرئيسي بالبحث والفرز والتصفية والإعدادات |
| 📊 الإحصائيات | stats.html |
13 رسمًا بيانيًا (Chart.js) تغطّي معظم الأعمدة |
| ❓ أسئلة ومعلومات | faq.html |
أسئلة شائعة وبطاقات معلومات سريعة |
| 🏆 المسابقة | quiz.html |
اختبار تفاعلي بثلاثة مستويات ونقاط وتشجيع |
| الميزة | الوصف | |
|---|---|---|
| 🔍 | بحث فوري | في أسماء السور والأنبياء والأسماء الحسنى |
| فرز | تصاعدي/تنازلي بالنقر على أي عمود | |
| 🧮 | تصفية لكل عمود | قائمة بالقيم الفريدة وعددها لكل عمود |
| ⚙️ | إعدادات شاملة | سمة، حركات، كثافة، حجم خط، أعمدة ظاهرة، بيانات إضافية، مفضلة |
| 🌙 | الوضع الليلي | زر سريع + مفتاح في الإعدادات، عبر متغيرات CSS |
| 📌 | تثبيت ذكي | تثبيت رأس الجدول عموديًا واسم السورة أفقيًا عند التمرير |
| 🔠 | حجم خط للجدول كله | منزلق يتحكم بحجم النص في كامل الجدول |
| 🧩 | تحليل الكلمات والجُمل | أعمدة: أطول كلمة، أقصر كلمة، أكثر جملة بدأت/انتهت بها الآيات |
| 🗄️ | بيانات إضافية | 16 عمودًا (مصحف ١٤٤١) تُظهَر عند الحاجة من الإعدادات |
| ⭐ | المفضلة | تمييز السور وحفظها في localStorage |
| 🎓 | جولة تعليمية | شرح مبسّط يظهر في أول زيارة |
| 📊 | رسوم بيانية | صفحة إحصائيات مستقلة عبر Chart.js |
| 🏆 | مسابقة | أسئلة ذكية تُولَّد من البيانات نفسها |
| 📤 | تصدير | إلى Excel و CSV |
| 📱 | PWA | قابل للتثبيت ويعمل دون إنترنت |
| ⚡ | أداء عالٍ | بناء الجدول عبر DocumentFragment |
الموقع جاهز للاستخدام مباشرةً من المتصفح — لا حاجة لأي تثبيت أو إعداد:
🔗 افتح الموقع: https://alhlhli.github.io/Quran-Database/
التطبيق يدعم تقنية PWA، فيمكن تثبيته كتطبيق حقيقي يعمل حتى دون إنترنت:
- على الأندرويد (Chrome): افتح الموقع ← قائمة (⋮) ← «تثبيت التطبيق» أو «إضافة إلى الشاشة الرئيسية».
- على الآيفون (Safari): افتح الموقع ← زر المشاركة (⬆️) ← «إضافة إلى الشاشة الرئيسية».
- على الكمبيوتر (Chrome/Edge): افتح الموقع ← أيقونة التثبيت (⊕) في شريط العنوان ← «تثبيت».
بعد التثبيت يعمل التطبيق بسرعة ودون اتصال، ويظهر بأيقونته الخاصة كأي تطبيق على جهازك.
Quran-Database/
├── index.html # الصفحة الرئيسية (الجدول)
├── stats.html # صفحة الإحصائيات البيانية
├── faq.html # صفحة أسئلة ومعلومات
├── quiz.html # صفحة المسابقة
├── style.css # الأنماط — أقسام واضحة + متغيرات ألوان
├── app.js # منطق الجدول — دوال صغيرة واضحة
├── stats.js # حساب ورسم الإحصائيات
├── quiz.js # محرّك توليد أسئلة المسابقة
├── quran-data.json # البيانات (صيغة عمودية مضغوطة)
├── quiz/
│ └── questions.json # قوالب أسئلة المسابقة حسب المستوى
├── manifest.json # بيان تطبيق الويب (PWA)
├── sw.js # Service Worker للعمل دون إنترنت
└── README.md
تقسيم الكود يحقّق تحميلًا أسرع، وتنظيمًا أفضل، وإمكانية تحديث البيانات دون لمس صفحة الـ HTML.
يستخدم المشروع صيغة عمودية مضغوطة (أصغر من مصفوفة الكائنات لأنها لا تكرّر المفاتيح):
{
"columns": ["id", "name", "number", "verses", "...", "longestWord", "pageCount"],
"data": [
[1, "الفاتحة", 1, 7, "...", "(ٱلعٰلمين، ٱلمستقيم 8)", 1],
[2, "البقرة", 2, 286, "...", "(فليستجيبوا 10)", 48]
]
}يحوّلها التطبيق تلقائيًا إلى كائنات عبر normalizeData()، مع دعم الصيغة القديمة
{ "surahs": [...] } للتوافق.
مجموعات الأعمدة:
- أساسية: الاسم، الرقم، ترتيب النزول، الآيات، الكلمات، الحروف، التصنيف، الحروف المقطعة، السجدات، ذكر «الله»، أول/آخر كلمة، أكثر كلمة/حرف، الأسماء الحسنى، الأنبياء، الأرقام، الألوان، الحيوانات، أطول/أقصر آية، المتوسطات، الحروف الفريدة وغير المذكورة، نهايات الآيات.
- تحليل الكلمات والجُمل: أطول كلمة، أقصر كلمة، أكثر جملة بدأت بها الآيات، أكثر جملة انتهت بها الآيات.
- بيانات إضافية (مصحف ١٤٤١ + أول/آخر/أكثر كلمة): الأجزاء، الأحزاب، الصفحات، الأسطر، النقاط، علامات الوقف، الفتحات، الضمات، الكسرات، السكون، الشدّات، تنوين الفتح/الضم/الكسر، المدود، الألف الخنجرية.
دقّة البيانات: روجِعت حقول مثل ذكر «الله»، السجدات (14 سورة، 15 سجدة)، الأنبياء (ضبط ذكر «موسى» على 34 سورة بالاسم الصريح، وإزالة «مريم»)، والحروف الفريدة اعتمادًا على ملفات إحصائية مدقّقة.
يفتح زر الإعدادات لوحة جانبية تتحكم في كل شيء، وتُحفظ التفضيلات في localStorage:
- المظهر: الوضع الليلي · تفعيل/إيقاف الحركات · كثافة الجدول · حجم الخط (لكامل الجدول).
- العرض: عرض المفضلة فقط.
- الأعمدة الظاهرة: اختيار أهم الأعمدة لتقليل الازدحام.
- بيانات إضافية: إظهار/إخفاء الأعمدة الإحصائية الإضافية (مصحف ١٤٤١) وأعمدة أول/آخر/أكثر كلمة.
- إعادة الضبط: مسح المفضلة · استعادة جميع الإعدادات الافتراضية.
اختبار تفاعلي تُولَّد أسئلته ديناميكيًا من قاعدة البيانات نفسها فتكون دقيقة ومتجدّدة:
- ثلاثة مستويات: مبتدئ (10 نقاط) · متوسط (15) · متقدم (20).
- اختيار عدد الأسئلة: 5 / 10 / 15 / 20.
- أنواع منوّعة: مكية/مدنية، عدد الآيات/الكلمات/الحروف، ذكر «الله»، أطول/أكثر سورة، أي نبي في سورة، في أي سورة ذُكر نبي، الحروف المقطّعة، أكثر نبي ذكرًا، التسلسل في المصحف... إلخ.
- نقاط وتشجيع: شرح لكل إجابة، رسالة تشجيعية حسب النسبة، وحفظ أفضل نتيجة لكل مستوى.
- قوالب الأسئلة محفوظة في
quiz/questions.json.
- التطبيق قابل للتثبيت على الجوال وسطح المكتب.
- يعمل دون اتصال بعد أول زيارة بفضل الـ Service Worker.
عند تحديث الكود، ارفع رقم النسخة في
sw.js(const CACHE = 'quran-db-v5') ليحصل المستخدمون على آخر إصدار فورًا.
- HTML5 / CSS3 — متغيرات CSS، تصميم متجاوب، وضع ليلي، أعمدة مثبّتة.
- JavaScript (Vanilla) — بلا أطر، دوال صغيرة،
DocumentFragmentللأداء. - Chart.js — الرسوم البيانية.
- SheetJS (xlsx) — تصدير Excel.
- Font Awesome — الأيقونات.
- PWA —
manifest.json+ Service Worker.
إذا وجدت خطأً في الأرقام أو الكلمات، أو لديك ميزة أو عمود تقترح إضافته — فتفضّل بمراسلتنا على الواتساب:
الرسالة ستبدأ تلقائيًا بـ: «لدي اقتراح أو تصحيح في قاعدة بيانات القرآن»
هذا المشروع مفتوح المصدر. يمكنك استخدامه وتعديله بحرية.
صُنع بعناية لخدمة كتاب الله ﷿ — م/ عامر الحلحلي