- PVSM.RU - https://www.pvsm.ru -
До некоторого момента front-end разработчик при написания javascript кода, рассчитанного на взаимодействие с пользователем, ориентировался лишь на «мышиные» события. Затем появились различные устройства, которые использовали другие формы взаимодействия пользователя с приложением — сенсоры или перо. Типы событий для каждого устройства были предложены индивидуальные. Так, кроме mousedown, mousemove итд., появились touchstart, touchmove и другие события.
Такой подход требует наличия альтернативных функций для поддержки нового типа устройства. Это часто порождает проблемы несовместимости, если изначально приложение было расчитано на одно устройство. К тому же, текущие платформы, которые используют сенсорные события, так же реагируют и на некоторые «мышиные» события (например, mousedown) в целях обратной совместимости. Это делает неоднозначным использование таких мышиных событий, нет возможности определить с каким конкретно устройством работает пользователь. Кроме того, есть ряд серьезных отличий в работе мышиных событий на сенсорных устройствах:
В результате, front-end разработчику при написании приложения приходится обрабатывать несколько видов событий, события мыши на десктопных ПК и touch события для сенсорных устройств. Код становится громоздким, процесс разработки — трудоемким..
Еще в сентябре 2012 года компания Microsoft преподносит следующую идею: конечный разработчик не должен задумываться о том с каким интерфейсом работает пользователь, щелкает ли он мышкой, нажимает пальцем или стилусом. В результате в Internet Explorer 10.0 появляются так называемые pointer-события (MSPointerDown, MSPointerMove итд), которые призваны одинаково работать на всех устройствах. Данный вид событий в этом браузере имеет префикс MS и, соответственно, в других браузерах не работает.
Pointer-события позволяют не только поддерживать все существующие устройства, MSPointer сконструирован таким образом, что вновь создаваемые устройства могут быть так же легко добавлены в этот список, существующий код автоматически будет поддерживать их.
Объект pointer-события предоставляет дополнительные свойства [1], которые помогают определить тип взаимодействия пользователя с приложением (мышь, прикосновение, стилус), геометрию области сенсорного контакта пользователя с устройством, давление и наклон пера. При желании разработчик может написать уникальный код для каждого устройства ввода.
Еще одно большое преимущество точечных событий заключается в том, что они поддерживают наведение (over и out события). На данный момент большинство устройств с сенсорным вводом имеют аппаратное ограничение, которое не позволяет отслеживать данные события. Тем не менее, в 2012 году Sony анонсировала первый мобильный телефон с «Floating Touch» [2] (плавающей сенсорной технологией), которая позволяет управлять устройством на расстоянии, подведя палец к экрану — Sony Xperia Sola. Таким образом, точечные события обеспечивают чистое решение не только для разработчиков, но и для производителей.
Идея была принята консорциумом WWW, в результате чего был разработан стандарт Pointer events [3], который на момент написания статьи имеет статус «кандидат в рекомендации». Это не означает, что члены W3C одобрили данную концепцию, проект может быть заменен, признан устаревшим в любое время. Тем не менее, документ находится в стадии разработки, данный вид событий имеет большие шансы на дальнейшее существование, несмотря на то, что сейчас поддерживается только в Internet Explorer 11 (в Internet Explorer 10.0 и в IE Mobile 10.0 с префиксом); Firefox 27.0, Chrome 33.0, Safari 6.0, Opera 18.0, IOS Safari 7.0, Opera Mini 7.0 Android Browser 4.4 данный вид событий пока не поддерживают даже с префиксом.
Для энтузиастов и для тех, кто сомневается в возможности кроссбраузерно применять pointer события в недалеком будущем, MS Open Tech (подконтрольная компания Microsoft) в декабре 2012 года анонсировала прототип Pointer Events для движка WebKit. Скачать прототип, а так же ознакомиться с документацией можно на сайте http://www.html5labs.com [4]
Для разработчиков кроссбраузерных и кроссплатформенных приложений существует несколько плагинов с помощью которых можно использовать pointer-события уже сейчас. Например, плагин hand.js [5], который размещен на CodePlex [6]. Он поддерживает практически все точечные события во всех современных браузерах. Internet Explorer поддерживается начиная с 9-ой версии. Для тех, кто ориентируется на IE8 и ниже — все-таки придется писать дополнительный код.
Библиотеку pointerevents [7] на данный момент рассматривать не будем, поскольку Internet Explorer поддерживается в ней, начиная с 10-ой версии, что для российской части интернета пока недостаточно.
Отдельно стоит упомянуть JQuery библиотеку, разработчики которой считают, что модель pointer-событий проще в использовании и более перспективная. На данный момент точечные события не поддерживаются напрямую в JQuery, но, конечно же, существует плагин jQuery PointerEvents [8], который призван исправить этот недостаток.
Как видите, pointer-события можно применять уже сегодня. И, вполне вероятно, через несколько лет мышиные события уйдут в прошлое…
Автор: webix
Источник [9]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/javascript/49185
Ссылки в тексте:
[1] дополнительные свойства: http://webix.pro/javascript/uchebnik/pointer-events.html#svojstva
[2] «Floating Touch»: http://www.youtube.com/watch?v=9Q73bHn9xus
[3] стандарт Pointer events: http://www.w3.org/TR/pointerevents/
[4] http://www.html5labs.com: http://www.html5labs.com/prototypes/pointer-events-for-webkit/pointer-events-for-webkit/info
[5] hand.js: http://handjs.codeplex.com/
[6] CodePlex: http://ru.wikipedia.org/wiki/CodePlex
[7] pointerevents: https://github.com/Polymer/PointerEvents
[8] jQuery PointerEvents: http://plugins.jquery.com/pointerevents/
[9] Источник: http://habrahabr.ru/post/203514/
Нажмите здесь для печати.