ويمكنك استخدام واجهة برمجة تطبيقات قفل لوحة المفاتيح لالتقاط مفتاح Escape في وضع ملء الشاشة.
إذا سبق لك تشغيل لعبة ويب بملء الشاشة ظهرت في مربّع حوار داخل اللعبة ألغيتها غريزيًا باستخدام مفتاح Escape، فربما تجد نفسك خروجًا من وضع ملء الشاشة. هذه التجربة المحبطة ناتجة عن استخدام مفتاح Escape في وضع "القتال" في مربّع الحوار ووضع ملء الشاشة. هذه معركة غير متساوية لأن الطريقة الافتراضية هي الفوز دائمًا لوضع ملء الشاشة. ولكن كيف يمكنك جعل مربع الحوار الفائز لمفتاح Escape؟ وهنا تظهر أهمية واجهة برمجة التطبيقات Keyboard Lock API.
المتصفحات المتوافقة
استخدام Keyboard Lock API
تتوفر واجهة برمجة التطبيقات Keyboard Lock API على navigator.keyboard.. تعرض طريقة
lock() في
واجهة Keyboard وعودًا بعد تفعيل إمكانية التقاط ضغطات المفاتيح لأي من مفاتيح لوحة المفاتيح الخارجية أو جميعها. ويمكن لهذه الطريقة الحصول فقط على المفاتيح التي
تم منحها إذن الوصول من خلال نظام التشغيل الأساسي. لحسن الحظ أن مفتاح Escape
هو واحد منها.
إذا كان تطبيقك يتضمن وضع ملء الشاشة، يمكنك استخدام Keyboard Lock API كتحسين تدريجي من خلال التقاط مفتاح Escape عند طلب وضع ملء الشاشة. افتح قفل لوحة المفاتيح
(أي لم تعُد تلتقطها) عند الخروج من وضع ملء الشاشة باستخدام طريقة
unlock()
في واجهة Keyboard.
// Feature detection.
const supportsKeyboardLock =
('keyboard' in navigator) && ('lock' in navigator.keyboard);
if (supportsKeyboardLock) {
document.addEventListener('fullscreenchange', async () => {
if (document.fullscreenElement) {
// The magic happens here… 🦄
await navigator.keyboard.lock(['Escape']);
console.log('Keyboard locked.');
return;
}
navigator.keyboard.unlock();
console.log('Keyboard unlocked.');
});
}
وهذا يعني أنّه عندما يكون المستخدم في وضع ملء الشاشة، يؤدي الضغط على Escape إلى إلغاء مربّع الحوار تلقائيًا. إذا ضغط المستخدم مع الاستمرار على مفتاح Escape، سيظل بإمكانه الخروج من وضع ملء الشاشة. أفضل ما في الميزتين.
الخصائص الديموغرافية
يمكنك اختبار كل من الصيغ التلقائية والمحسّنة تدريجيًا في العرض التوضيحي. تعد رمز مصدر العرض التوضيحي أقل وضوحًا من المقتطف أعلاه، لأنه يحتاج إلى إظهار كلا السلوكين.
التطبيق العملي
لاستخدام هذا التحسين التدريجي عمليًا، ما عليك سوى نسخ المقتطف أعلاه. والهدف منها العمل بدون الحاجة إلى أي تغييرات، حتى مع رمز ملء الشاشة الحالي. على سبيل المثال، انظر PR الخاص بلعبة Freeciv. بعد دمج النسخة العامة، يمكنك إلغاء جميع مربّعات الحوار داخل اللعبة من خلال الضغط على Escape.
تطبيق مختصر إضافي
لن تكون جميع التطبيقات أو الألعاب التي تدعم وضع ملء الشاشة مفتوحة المصدر أو ستقبل التصحيحات، حيث يمكن إضافة الإشارات المرجعية التالية إلى شريط الإشارات المرجعية والنقر على لتحسين وضع ملء الشاشة.