Рубрика: HTML5, JavaScript, CCS3

С помощью технологии WebUsb API можно осуществлять подключения к usb -устройствам которые находятся на компьютере (Пример можно скачать по ссылке снизу).

!!! Внимание. Перед использованием примеров нужно убедиться, что adb отключено

adb kill-server

!!! Внимание. В примере кода явно вбит vendorId, его нужно заменить на требуемый.

Adb.WebUSB.Transport.open = function() {
        // было так
        // let filters = [
        //     { classCode: 255, subclassCode: 66, protocolCode: 1 },
        //     { classCode: 255, subclassCode: 66, protocolCode: 3 }
        // ];

        let filters = [{
            vendorId: '2821'
        }];
        return navigator.usb.requestDevice({ filters: filters })
            .then(device => device.open()
                .then(() => new Adb.WebUSB.Transport(device)));
};

Чтобы узнать vendorId выполните следующий пример узнать vendorId

Запускаем наш пример.

Подключаем устройство по кабелю (нужно убедиться чтобы отладка по USB кабелю была включена).

Пример можно скачать отсюда.

Полезные ссылки:

• https://github.com/webadb/webadb.js — библиотека
• https://github.com/webadb/webadb.github.io — пример подключения
• https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb — расширение для Chrome, чтобы создавать web-сервер
• https://developers.google.com/web/updates/2016/03/access-usb-devices-on-the-web — статья с описанием

Для создание одного js-файлай из нескольких можно использовать утилиту от Google — Closure Compiler

1. устанавливаем Java Runtime Environment version 7, если у Вас её нет
2. Скачиваем файл compiler.jar
3. Распаковываем в папку например e:\compressionjs
4. Для примера создаем в этой папке js — файл (например simple.js)

5. Выполняем команду java -jar compiler.jar —js sample.js —js_output_file hello-compiled.js

Примечание: Если нужно по всей папке собрать, то можно выполнить java -jar compiler.jar —js=»*.js» —js_output_file hello-compiled.js

Подробнее о командах можно узнать java -jar compiler.jar —help

Простой способ определения было ли касание рукой или стилусом.

У событие должен быть объект browserEvent или его аналог. В нем должен быть массив targetTouches (https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/targetTouches). У элемента массива должны быть следующие свойства:

• force — Возвращает количество давления, прикладываемого к поверхности пользователем, как floatмежду 0.0(без давления) и 1.0(максимальное давление)
• radiusX — Возвращает радиус X эллипса, который наиболее точно описывает область контакта с экраном. Значение находится в пикселах того же масштаба, что и screenX
• radiusY — Возвращает радиус Y эллипса, который наиболее близко описывает область контакта с экраном. Значение находится в пикселах того же масштаба, что и screenY.

Из тестов было выявлено, что если

if (touch.force > 0.4 || (touch.radiusX > 3.6 && touch.radiusY > 3.6)){
    //касание рукой или нажатие пальцем
}