QuizMaster

تبدو لعبة الأسئلة بسيطة، لكن الجيدة منها فيها أجزاء متحركة كثيرة: أسئلة تصل من API، ومؤقّت يجب أن يتوقف في اللحظة الصحيحة، وإجابات يجب أن تُحسب مرة واحدة فقط، ونتيجة تبقى محفوظة بين الجولات.

بناء اللعبة في كلاسين بمسؤوليات واضحة: Quiz يملك حالة اللعبة — الإعدادات والنتيجة والتقدّم وأفضل النتائج — بينما Question يملك عرض السؤال الواحد ومؤقّته والتحقق من إجابته.

ثيم نيون بروح الألعاب مع خلفية سداسية، وخط عرض جريء، وتغذية راجعة واضحة: تُميَّز الإجابات الصحيحة والخاطئة، وتظهر رسالة «انتهى الوقت» حين ينفد العدّاد.

تقسّم ES Modules الكود إلى quiz.js و question.js و ui-controls.js. يُستدعى Open Trivia DB API بالتصنيف والصعوبة والعدد المختار؛ وتُخلط الإجابات عشوائيًا وتُفك ترميزات HTML في الأسئلة باستخدام DOMParser.

يمكن للاعب الإجابة بالماوس أو بالمفاتيح 1–4، وبدء اللعبة بزر Enter، ورؤية رسائل مفيدة إن كان نموذج الإعداد ناقصًا. وتغطي حالات التحميل والخطأ استدعاء الـ API.

كان الجزء الصعب المؤقّت ومستمعي الأحداث. إذا أجاب اللاعب في اللحظة نفسها التي انتهى فيها الوقت، أو بقي مستمع لوحة مفاتيح من سؤال سابق فعّالًا، فقد تُحسب الإجابة نفسها مرتين.

صار كل سؤال يبدأ مؤقّته الخاص ويزيل مستمعيه بنفسه حين ينتهي — بإجابة أو بنفاد الوقت — ويعلّم نفسه كسؤال مُجاب فيتجاهل أي إجراء ثانٍ.

بلا إطار عمل ولا خطوة بناء تُحمَّل اللعبة فورًا. وتُحفظ أفضل النتائج في LocalStorage، مرتبة ومقتطعة لأفضل عشرة، وتُقرأ بأمان داخل try/catch.

لعبة مصقولة تستحق اللعب أكثر من مرة، وتُظهر JavaScript كائنية التوجه نظيفة أثناء العمل. منشورة على GitHub Pages.