Устройства пользовательского интерфейса в Интернете: несколько быстрых примеров

Подключение к необычным устройствам из вашего приложения.

Джо Медлей
Joe Medley
Мэтт Рейнольдс
Matt Reynolds

Что такое API WebHID?

Многие устройства интерфейса пользователя (HID) слишком новые, слишком старые или слишком необычные, чтобы быть доступными для драйверов устройств системы. API WebHID решает эту проблему, предоставляя способ реализации логики, специфичной для устройства, в JavaScript.

Предлагаемые варианты использования API WebHID

HID принимает входные данные от людей или предоставляет выходные данные им. Примерами устройств являются клавиатуры, указательные устройства (мыши, сенсорные экраны и т. д.) и игровые планшеты. Протокол HID позволяет получать доступ к этим устройствам на настольных компьютерах с помощью драйверов операционной системы. Веб-платформа поддерживает HID, полагаясь на эти драйверы.

Невозможность доступа к необычным HID-устройствам особенно болезненна, когда дело касается поддержки геймпадов. Геймпады, разработанные для ПК, часто используют HID для входов геймпада (кнопки, джойстики, триггеры) и выходов (светодиоды, вибрация). Однако входы и выходы геймпада недостаточно стандартизированы, и веб-браузеры часто требуют специальной логики для определенных устройств. Это неустойчиво и приводит к плохой поддержке длинного хвоста старых и необычных устройств. Это также заставляет браузер зависеть от особенностей поведения определенных устройств.

Демо, демо, демо

Если вам интересно, как работает любой из этих примеров, исходный код для всех них доступен на GitHub. В пояснении есть пример кода barebone .

Подсветка клавиатуры MacBook Pro

Самым большим препятствием для использования любой из этих демонстраций является отсутствие доступа к устройству. К счастью, если у вас есть MacBook Pro с TouchBar, вам не нужно ничего покупать. Эта демонстрация позволяет использовать API прямо с вашего ноутбука. Она также показывает, как WebHID можно использовать для разблокировки функциональности встроенных устройств, а не только периферийных.

Автор: FWeinb
Демонстрация/Источник: Подсветка клавиатуры

Игровые контроллеры

Беспроводной контроллер PlayStation 4

Далее следует то, что, скорее всего, есть у немногих из вас. DualShock 4 от Sony — это беспроводной контроллер для игровых консолей PlayStation 4.

DualShock 4 Demo использует WebHID для получения необработанных отчетов ввода от DualShock 4 и предоставляет высокоуровневый API для доступа к гироскопу, акселерометру, сенсорной панели, кнопкам и вводам джойстика контроллера. Он также поддерживает вибрацию и настройку цвета светодиода RGB, размещенного внутри контроллера.

Автор: TheBITLINK
Демо: Демо DualShock 4 ( Источник )

Контроллеры Joy-Con для Nintendo Switch

Играйте в игру Chrome dino 🦖 офлайн, фактически прыгая с контроллером Nintendo Switch Joy-Con в карманах брюк. Эта демоверсия работает на Joy-Con WebHID , драйвере WebHID для контроллеров Nintendo Switch Joy-Con.

Автор: Томас Штайнер
Демонстрация: Chrome Dino WebHID ( исходный код демонстрации , исходный код драйвера )

Полоска BlinkStick

BlinkStick Strip — это HID-совместимая световая полоса с 8 RGB-светодиодами. Демонстрация позволяет пользователю выбирать из нескольких шаблонов мигания, включая погоню, мигание и сканер Ларсона (он же Cylon).

Автор: Робат Уильямс
Демонстрация: blinkstick-strip ( источник )

Что делает эта демонстрация? (Подождите.) Она мигает. На самом деле это три демонстрации, которые используют мигающий(1) индикатор USB-уведомлений.

Blink(1) прост и хорошо документирован, что делает его отличным вариантом для начала работы с HID.

Автор: Тод Э. Курт
Демонстрации: blink(1) ( источник )

Благодарности

Благодарим Пита ЛеПейджа и Кейси Баскес за рецензии на эту статью.

Фото Угура Акдемира на Unsplash