https://github.com/mattdsteele/bt-device

A small (900 byte) custom element to help use Web Bluetooth
https://github.com/mattdsteele/bt-device

Last synced: about 2 months ago
JSON representation

A small (900 byte) custom element to help use Web Bluetooth

• Host: GitHub
• URL: https://github.com/mattdsteele/bt-device
• Owner: mattdsteele
• Created: 2020-05-03T15:30:04.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2023-02-03T06:41:33.000Z (almost 2 years ago)
• Last Synced: 2024-10-24T07:33:02.460Z (3 months ago)
• Language: JavaScript
• Size: 521 KB
• Stars: 2
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-standalones - `<bt-device>`

README

        
# ``

A small (900 byte) Custom Element to make [Web Bluetooth](https://steele.blue/web-bluetooth/) a little easier to use.

**See it in action** (with a Bluetooth heart rate monitor): https://output.jsbin.com/mohezur/11

More details here: https://steele.blue/renderless-web-components/

## Usage

Import it via your method of choice, but unpkg works great:

```html

```

Then add a (render-less) element to your page with the settings you'd like:

```html

```

## Properties

`service: string`

The GATT service you wish to interact with. Can be a UUID or a [standardized service](https://www.bluetooth.com/specifications/gatt/services/)

`characteristic: string`

The GATT characteristic you wish to interact with. Can be a UUID or a [standardized characteristic](https://www.bluetooth.com/specifications/gatt/characteristics/)

`notifications: boolean`

Whether to receive notifications (event stream) from the characteristic after connecting.

`parse: DataView => any`

An optional function property you can use to "shape" the raw binary data coming from the Bluetooth device. Set this property to a function and it will be executed each time your characteristic emits data:

```js

btDevice.parse = (input) {

  const percentLeft = input.getUint8(0) / 2;

  return percentLeft;

}

```

`connectOptions: Object`

Override the auto-generated connection options object. See https://developer.mozilla.org/en-US/docs/Web/API/Bluetooth/requestDevice for details

## Generated Properties

`btService: BluetoothRemoteGATTService`

Once connected, provides access to the service interface

`btChar: BluetoothGATTCharacteristic`

Once connected, provides access to the characteristic interface

## Methods

`connect(): Promise`

Attempts to connect to the Bluetooth device

## Events

`data: CustomEvent`

Emitted whenever the `characteristicvaluechanged` event occurs. Will contain an object that contains the data (passed through `parse` if it is set).

```js

btDevice.addEventListener('data', (e) => {

  const value = e.detail.value;

  console.log(value);

});

```