يمكن الآن لتطبيقات الويب إيقاف تسريع الماوس عند تسجيل أحداث المؤشر.
إنّ الحركة المتسارعة هي ميزة مناسبة للاستخدام عند استخدام الماوس أو لوحة اللمس بهدف تحريك المؤشر على الشاشة. يتيح هذا الوضع التحرك بدقة من خلال التحرك ببطء، مع السماح أيضًا للمؤشر بالانتقال عبر الشاشة بالكامل بحركة قصيرة وسريعة. على وجه التحديد، بالنسبة إلى المسافة الفعلية نفسها التي تتحرّك بها الماوس، يتحرّك المؤشر على الشاشة لمسافة أطول إذا تم قطع المسافة بشكل أسرع.
تفعِّل أنظمة التشغيل ميزة تسريع الماوس تلقائيًا. في بعض ألعاب وجهة نظر الطرف الأول، وغالبًا ما تكون ألعاب إطلاق النار من منظور الشخص الأول، يتم استخدام بيانات الإدخال الأولية من الماوس للتحكّم في دوران الكاميرا بدون تعديل التسارع. يؤدي التأثير المادي نفسه، سواء كان بطيئًا أو سريعًا، إلى الدوران نفسه. ويؤدي ذلك إلى تجربة ألعاب أفضل ودقة أعلى وفقًا للاعبين المحترفين.
بدءًا من الإصدار 88 من Chrome، يمكن لتطبيقات الويب التبديل بين بيانات حركة الماوس المتسارعة وغير المتسارعة بفضل واجهة برمجة التطبيقات المعدَّلة لميزة "قفل المؤشر".
تستخدم منصات الألعاب المستندة إلى الويب، مثل Google Stadia وNvidia GeForce Now هذه الإمكانات الجديدة لإرضاء لاعبي ألعاب إطلاق النار من منظور الشخص الأول.
استخدام واجهة برمجة التطبيقات
طلب قفل المؤشر
قفل المؤشر هو المصطلح الرسمي الذي يُستخدَم عندما يخفي تطبيق سطح المكتب رمز المؤشر ويفسّر حركة الماوس لأداء مهمة أخرى، مثل الاطّلاع على محيطك في عالم ثلاثي الأبعاد.
تُعلمك سمتا movementX
وmovementY
من أحداث المستند mousemove
بمدى تحرك مؤشر الماوس منذ آخر حدث نقل. ومع ذلك،
لا يتم تعديل هذه القيم عند نقل المؤشر خارج صفحة الويب.
document.addEventListener("mousemove", (event) => {
console.log(`movementX: ${event.movementX} movementY: ${event.movementY}`);
});
من خلال التقاط مؤشر الماوس (أو طلب قفل المؤشر)، لن تحتاج إلى القلق بشأن خروج المؤشر من الشاشة بعد الآن. وهذا مفيد بشكل خاص لألعاب الويب immersive. عند قفل المؤشر، تنتقل جميع أحداث الماوس إلى العنصر المستهدَف لقفل المؤشر.
استخدِم requestPointerLock()
في العنصر المستهدَف لطلب قفل المؤشر،
واسمِع أحداث pointerlockchange
وpointerlockerror
لتتبُّع التغييرات في قفل
المؤشر.
const myTargetElement = document.body;
// Call this function to request a pointer lock.
function requestPointerLock() {
myTargetElement.requestPointerLock();
}
document.addEventListener("pointerlockchange", () => {
if (document.pointerLockElement) {
console.log(`pointer is locked on ${document.pointerLockElement}`);
} else {
console.log("pointer is unlocked");
}
});
document.addEventListener("pointerlockerror", () => {
console.log("pointer lock error");
});
إيقاف ميزة "تسريع الماوس"
اتصل بالرقم requestPointerLock()
باستخدام { unadjustedMovement: true }
لإيقاف
التعديل على مستوى نظام التشغيل لتسريع الماوس والوصول إلى إدخال الماوس الأوّلي.
بهذه الطريقة، لن تتضمّن بيانات حركة الماوس من أحداث mousemove
سرعة صعود الماوس عند قفل المؤشر.
استخدِم الوعد الجديد الذي تم إرجاعه من requestPointerLock()
لمعرفة ما إذا كان الطلب
قد تم بنجاح.
function requestPointerLockWithUnadjustedMovement() {
const promise = myTargetElement.requestPointerLock({
unadjustedMovement: true,
});
if (!promise) {
console.log("disabling mouse acceleration is not supported");
return;
}
return promise
.then(() => console.log("pointer is locked"))
.catch((error) => {
if (error.name === "NotSupportedError") {
// Some platforms may not support unadjusted movement.
// You can request again a regular pointer lock.
return myTargetElement.requestPointerLock();
}
});
}
من الممكن التبديل بين بيانات حركة الماوس المتسارعة وغير المتسارعة بدون إزالة قفل المؤشر. ما عليك سوى طلب قفل المؤشر مرة أخرى مع الخيار المطلوب. إذا تعذّر هذا الطلب، سيظل القفل الأصلي intact سليمًا وسيتم رفض الوعد الذي تم إرجاعه. لن يتم تشغيل أي أحداث لقفل المؤشر لطلب تغيير تعذّر تنفيذه.
دعم المتصفح
تتوفّر واجهة برمجة التطبيقات Pointer Lock API بشكل جيد في جميع المتصفّحات. ومع ذلك، فإنّ المتصفّحات المستندة إلى Chromium (مثل Chrome وEdge وما إلى ذلك) هي الوحيدة التي تتيح إيقاف تعديل تسريع الماوس على مستوى نظام التشغيل اعتبارًا من تشرين الأول (أكتوبر) 2020. اطّلِع على جدول توافق المتصفّح في MDN للاطّلاع على آخر المعلومات.
دعم نظام التشغيل
يمكن إيقاف ميزة "تسريع الماوس" على مستوى نظام التشغيل على ChromeOS و macOS Catalina 10.15.1 وWindows. ستتوفّر الميزة لنظام التشغيل Linux لاحقًا.
عيّنة
يمكنك استخدام Pointer Lock API من خلال تشغيل النموذج على Glitch. احرص على الاطّلاع على رمز المصدر.
روابط مفيدة
- الشرح
- العلاقات العامة حول المواصفات
- مستودع GitHub
- إدخال ChromeStatus
- خطأ تتبُّع في Chrome
- نية الشحن
- موقف Mozilla
- موضع WebKit
الشكر والتقدير
نشكر جيمس هوليير وتوماس شتاينر وجو ميدلي وكايسي باسكيز و فنسنت شيب على مراجعاتهم لهذه المقالة.