The document discusses using web APIs to interact with Bluetooth devices. It provides an overview of the Bluetooth protocol and describes how to use the Web Bluetooth and Web Audio APIs to connect to Bluetooth devices, read audio data, detect vowels in speech, and send commands to control devices. Code examples are given for connecting to a device, reading frequency data from the audio stream, analyzing it to determine vowels, and writing messages to a Bluetooth characteristic to trigger actions like vibration. The goal is to enable creative uses of web APIs to experiment with Bluetooth and audio.
2. What? Why?
Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
3. What? Why?
Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
4. Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
What? Why?
5. Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
What? Why?
6. Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
What? Why?
7. Ahhh
Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
What? Why?
8.
9.
10. Web Bluetooth API Support
Devices with
Bluetooth 4.0 or higher
Chrome, Chrome on Android,
Samsung Internet, Opera
Created by Ben Davis from the Noun Project, Created by Viktor Vorobyev from the Noun Project
11. Three Steps to Happiness
Write Data
via Bluetooth API
Connect
Bluetooth Device
Request Connection
Read
Audio Data
Expose Vowels
Uncover Bluetooth Commands
37. How to detect Vowels
formants:
f1 = ~800hz
f2 = ~1600hz
https://de.wikipedia.org/wiki/Formant
38. Vowel Detection within the Web
AudioContext MediaStreamAudioSourceNode AnalyserNode
Create Context and Nodes
Connect Nodes
MediaStreamAudioSourceNode AnalyserNode Destination
39. Vowel Detection within the Web
let audioContext = new window.AudioContext();
let stream = document.getElementById('video').captureStream();
let audioSource = audioContext.createMediaStreamSource(stream);
let analyser = audioContext.createAnalyser();
audioSource.connect(analyser);
analyser.connect(audioContext.destination);
40. Vowel Detection within the Web
let audioContext = new window.AudioContext();
let stream = document.getElementById('video').captureStream();
let audioSource = audioContext.createMediaStreamSource(stream);
let analyser = audioContext.createAnalyser();
audioSource.connect(analyser);
analyser.connect(audioContext.destination);
58. Write to a Bluetooth Characteristic
const LUSH_TX_CHARACTERISTIC = '6e400002-b5a3-f393-e0a9-e50e24dcca9e';
let txCharacteristic = null;
button.addEventListener('click', () => {
/* … */
}).then((server) => {
return server.getPrimaryService(LUSH_SERVICE);
}).then((service) => {
return service.getCharacteristic(LUSH_TX_CHARACTERISTIC);
}).then((characteristic) => { txCharacteristic = characteristic; });
});
59. const LUSH_TX_CHARACTERISTIC = '6e400002-b5a3-f393-e0a9-e50e24dcca9e';
let txCharacteristic = null;
button.addEventListener('click', () => {
/* … */
}).then((server) => {
return server.getPrimaryService(LUSH_SERVICE);
}).then((service) => {
return service.getCharacteristic(LUSH_TX_CHARACTERISTIC);
}).then((characteristic) => { txCharacteristic = characteristic; });
});
Write to a Bluetooth Characteristic
60.
61. const LUSH_TX_CHARACTERISTIC = '6e400002-b5a3-f393-e0a9-e50e24dcca9e';
let txCharacteristic = null;
button.addEventListener('click', () => {
/* … */
}).then((server) => {
return server.getPrimaryService(LUSH_SERVICE);
}).then((service) => {
return service.getCharacteristic(LUSH_TX_CHARACTERISTIC);
}).then((characteristic) => { txCharacteristic = characteristic; });
});
Write to a Bluetooth Characteristic
62. if (vowel === 'a') {
let message = new TextEncoder('ASCII').encode('Vibrate:10;');
txCharacteristic.writeValue(message);
} else {
let message = new TextEncoder('ASCII').encode('Vibrate:0;');
txCharacteristic.writeValue(message);
}
Write to a Bluetooth Characteristic
63. if (vowel === 'a') {
let message = new TextEncoder('ASCII').encode('Vibrate:10;');
txCharacteristic.writeValue(message);
} else {
let message = new TextEncoder('ASCII').encode('Vibrate:0;');
txCharacteristic.writeValue(message);
}
Write to a Bluetooth Characteristic
Next video: https://www.youtube.com/watch?v=-74Tyi-fvi8