يتضمّن Chrome 47 ميزة جديدة تسهّل فهم كيفية تفاعل المستخدمين مع موقعك الإلكتروني، وهي: InputDeviceCapabilities! لنعد للوراء قليلاً ونتعرف على سبب أهمية ذلك.
أحداث إدخال نموذج العناصر في المستند (DOM) هي فكرة مجرّدة فوق أحداث الإدخال منخفضة المستوى، وترتبط بشكل غير مباشر بإدخال الجهاز المادي (مثل يمكن تنشيط أحداث "click" باستخدام الماوس
أو شاشة تعمل باللمس أو لوحة المفاتيح). ومع ذلك، هناك مشكلة: ما مِن طريقة بسيطة للحصول على تفاصيل الجهاز الفعلي المسؤول عن أحد الأحداث.
بالإضافة إلى ذلك، يمكن لأنواع معينة من الإدخالات إنشاء أحداث إدخال DOM "المزيفة" لأسباب تتعلق بالتوافق. ويحدث أحد أحداث DOM الزائفة عندما ينقر المستخدم على شاشة تعمل باللمس (على سبيل المثال على هاتف جوّال)؛ ولا يؤدي ذلك إلى تنشيط أحداث اللمس فحسب، بل يؤدي إلى تنشيط أحداث الماوس أيضًا لأسباب تتعلّق بالتوافق.
وهذا يسبب مشاكل للمطورين عند إتاحة الإدخال بالماوس واللمس. من الصعب معرفة ما إذا كان حدث mousedown يمثّل إدخالاً جديدًا من الماوس، أو ما إذا كان مجرد حدث توافق مع حدث بدء اتصال سبق أن تمت معالجته.
توفّر واجهة برمجة التطبيقات InputDeviceCapabilities الجديدة تفاصيل حول المصادر
الأساسية لأحداث الإدخال من خلال عنصر sourceCapabilities في UIEvent.
يحتوي العنصر على خاصية firesTouchEvents مضبوطة على true أو false استنادًا إلى كيفية إنشاء الحدث من خلال إجراء المستخدم
يتبادر إلى أذهاننا سؤالٌ مُلح هو: أين ينبغي استخدام هذا؟
وبعيدًا عن أحداث Pointer، يتعامل العديد من المطوّرين حاليًا مع التفاعل في طبقة اللمس، ويمنع الخيار التلقائي في تجنُّب إنشاء أحداث ماوس "مزيّفة" في المقام الأول.ويعمل هذا التصميم بشكلٍ جيد في العديد من السيناريوهات ولا يحتاج إلى تغيير للاستفادة من InputDeviceCapabilities.
ولكن في بعض السيناريوهات، قد لا يكون مطلوبًا منع "الإعداد التلقائي" لحدث اللمس. على سبيل المثال، قد تحتاج إلى النقر لإرسال أحداث "النقر" وتغيير التركيز. في هذه الحالات، تتيح لك المعلومات المحفوظة في السمة
MouseEvent.sourceCapabilities.firesTouchEvents بدء
دمج منطق الأحداث التي تعتمد على اللمس والماوس في نموذج
مشابه لطريقة إدارة المنطق باستخدام أحداث المؤشر. وهذا يعني أنّه يمكنك امتلاك مجموعة واحدة فقط من الرموز التي تدير منطق التفاعل وتوفّر للمطوّرين طريقة أبسط لمشاركة المنطق بين المتصفحات التي تتيح أحداث المؤشر ولا تدعمها.
function addMouseEventListener(target, type, handler, capture) {
target.addEventListener(type, function(e) {
if (e.sourceCapabilities.firesTouchEvents)
return false;
return handler(e);
}, capture);
}
الخبر السار هو أنّ Rick Byers قد اختار Polyfill استخدامها لتتمكّن من استخدامها على معظم المنصات.
في الوقت الحالي، أصبحت واجهة برمجة التطبيقات هذه ضئيلة للغاية، وتركّز على حلّ مشكلة معيّنة في تحديد أحداث الماوس المستمدة من أحداث اللمس.
ويمكن أيضًا إنشاء مثيل لـ InputDeviceCapabilities،
ولكنه يحتوي فقط على firesTouchEvents. من المتوقع في المستقبل
التوسع
لتمكينك من فهم المزيد عن جميع أجهزة الإدخال في
نظام المستخدم. تسرّنا معرفة ملاحظاتك حول
حالات الاستخدام.