इनपुट डिवाइस की क्षमताएं

पॉल किनलन
पॉल किनलन

Chrome 47 में एक नई सुविधा है, जिससे यह आसानी से समझा जा सकता है कि उपयोगकर्ता आपकी साइट से कैसे इंटरैक्ट करते हैं: InputDeviceCapabilities! आइए थोड़ा पीछे जाएं और जानें कि यह ज़रूरी क्यों है.

डीओएम इनपुट इवेंट, लो-लेवल इनपुट इवेंट से ऊपर मौजूद एक ऐब्स्ट्रैक्शन है, जो फ़िज़िकल डिवाइस इनपुट से (उदाहरण के लिए, click इवेंट को माउस, टचस्क्रीन या कीबोर्ड से ट्रिगर किया जा सकता है. हालांकि, एक समस्या यह है कि किसी घटना के लिए ज़िम्मेदार डिवाइस के बारे में जानकारी पाने का कोई आसान तरीका नहीं है.

इसके अलावा, कुछ खास तरह के इनपुट, साथ काम करने की वजहों से और भी "नकली" DOM इनपुट इवेंट जनरेट कर सकते हैं. ऐसा एक नकली DOM इवेंट तब होता है, जब कोई उपयोगकर्ता किसी टचस्क्रीन (जैसे किसी मोबाइल फ़ोन पर) पर टैप करता है; यह न सिर्फ़ टच इवेंट को फ़ायर करता है, बल्कि साथ काम करने की वजहों से माउस इवेंट भी करता है.

इससे डेवलपर को माउस और टच इनपुट, दोनों के साथ काम करते समय समस्याएं आती हैं. यह पता लगाना मुश्किल है कि क्या mousedown इवेंट वाकई माउस से नए इनपुट को दिखाता है या यह पहले से प्रोसेस किए गए टचस्टार्ट इवेंट के साथ काम करने वाला सिर्फ़ एक इवेंट है.

नया InputDeviceCapabilities API, यूज़र इंटरफ़ेस (यूआई) पर sourceCapabilities ऑब्जेक्ट के ज़रिए इनपुट इवेंट के बुनियादी सोर्स की जानकारी देता है.
ऑब्जेक्ट में एक firesTouchEvents प्रॉपर्टी है, जो true या false पर सेट है. यह प्रॉपर्टी इस बात पर निर्भर करती है कि उपयोगकर्ता की कार्रवाई से इवेंट कैसे जनरेट हुआ.

सवाल यह है: इसका इस्तेमाल कहां किया जाना चाहिए?

पॉइंटर इवेंट के अलावा, आज के कई डेवलपर टच-लेयर में इंटरैक्शन के लिए तर्क को संभालते हैं, जिससे डिफ़ॉल्ट को "नकली" माउस इवेंट बनने से पहले ही रोका जा सकता है.यह डिज़ाइन कई स्थितियों में अच्छी तरह से काम करता है और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);  
}

अच्छी बात यह है कि इसे रिक बायर्स ने पॉलीफ़िल किया है, ताकि आप इसे ज़्यादातर प्लैटफ़ॉर्म पर इस्तेमाल कर सकें.

फ़िलहाल, यह एपीआई बहुत कम काम कर रहा है. यह टच इवेंट से मिलने वाले माउस इवेंट की पहचान करने से जुड़ी एक खास समस्या को हल करने पर फ़ोकस करता है. InputDeviceCapabilities का इंस्टेंस इंस्टैंशिएट करना भी संभव है. हालांकि, इसमें सिर्फ़ firesTouchEvents होता है. आने वाले समय में, इसे बड़ा किया जा सकता है, ताकि आप उपयोगकर्ता के सिस्टम पर मौजूद सभी इनपुट डिवाइसों के बारे में ज़्यादा जान सकें. हमें इस्तेमाल के उदाहरणों के बारे में आपकी राय जानकर खुशी होगी.