 So this is not I haven't prepared anything any any talk for this really. I Just wanted to show something which I thought was cool I'll be quick. Can you see my computer? Oh, I can look Yeah, I don't know how to increase the volume because the stupid touch bar has got this I don't have you. Okay. All right. All right. So this is something I made a while back So I bought bought these things So I'm not sure if what everybody does this, but when I when I listen to music And I like the drums. I like to pretend I'm playing the drums And I thought well, maybe Maybe maybe I can play the drums But then I got on a drum kit and I realized I was very bad at it And I was like well, maybe it's because I've been practicing my whole life without a kid there And I thought well, maybe if I get like maybe there's a product out there That allows me to play the drums in the air And turns out there is So there's the these things they're little Bluetooth It's like a it's a Bluetooth sensor really it comes with an app You can connect it to your phone and then you can play your drums I didn't like the built-in sounds and one problem was that the The the hi-hat sound was too loud and I wanted to turn it down But they have no mixer in the in the drumming app And I thought well, maybe I can build my own app I figured that they probably spoke midi And I figured that they were I knew that they were Bluetooth. So and I know that there's a Bluetooth There's a new Bluetooth Web Bluetooth thing in the browser. Maybe I can connect to these In the browser and I mean I've sort of spoiled spoiled it like you know that the answer is yes I could do it. Well, I probably can we'll see it's a demo. So anything can happen but Here we go These things these things are called uh free drum free drum dot rocks uh I can't actually I I'm not actually any good at this at all. So I'm not and I'm not even going to attempt But see I I just paired this device Oh, yeah, I didn't really design this with um Accessibility in mind. Uh, it's very dark. It looks pretty on my end. Oh says it's connecting. Hang on Hold on. Hold on. Hold on. You see demo. I tested this last night and it worked Hold on Come on What um web Bluetooth Why is it doing this to me now? Yeah, yeah, I knew this would happen. Okay Hang on Fresh the page. Oh ready. Okay. So And then there's a high the hat over here And you can there's up to four you can get one the get one that straps to your foot And it'll play the kick drum. I don't know if this is actually educational at all But it's kind of cool. I'll just put it in my shoe Which way that way? Oh, I have to connect this. I've got three. I know one of these maybe this one I don't have yep There we go. Okay. So anyway, um So this is kind of cool. Uh, let me just show you I want to just go through the code just quickly Um, oh, that's what's that called? Bluetooth I forgot what it's called jazz bluetooth. That's it. So one thing which sucks is that um The the browser doesn't have any built So you probably remember back in the day playing video games and they they made like little honky noises for music And they'd be able to do this in you know, they didn't come with an audio CD. They're playing midi files Does everybody who doesn't know what midi is? Everybody. Oh, okay. So midi. It's just like instead of instead of sending audio. It sends instructions. So for example, this thing Um, when when I do this it sends a instruction to say, um, you know note c five Velocity, um, like the the volume 100. Um, while this would be um c at volume 20 this will be volume 100 and it just sends instructions and then you have to have some some Something which will convert those instructions into sounds unfortunately Uh, yeah browser just doesn't have this built-in anymore. Um, I think they used to but they don't anymore And I also use this as an example. I wanted to try to write code Yeah, exactly. Yeah It's a real shame. Um that so this is this is how I code stuff all just in one file When I'm mucking around because it stops you from trying to make things Organize things. Uh, so Yeah, I tried to do this without without bundling as well. Um, so everything here is loaded from a script tag Oh god So you have to get these stupid names I had to reverse engineer a lot of this stuff And then I found out after I'd finished it that like the information was on a forum I spent like six hours like trying to figure out getting the messages trying to decode because do you just get binary the midi messages binary Um, I just had to guess that it was midi Turns out it was but with this offset and I had to mess around with it. Anyway, I figured it out eventually Uh, let me find the bluetooth. Oh, yeah, so you just do this This kind of stuff here You connect you get the services so each one of these devices um has um services that it provides and then those um services have characteristics and then Um, you can listen to uh, the characteristics are the things which are sort of like um producing values So for example here, uh, let's find out what's listening for this Yeah, here we go. Yeah, so, uh, this particular device Um When it no that's when it disconnects here we go Characteristic value. So so when the characteristic changes so this characteristic is this this note I I parse it convert it into um midi instructions and then I send it Um using this thing called I have to use a jazz plugin. It's it looks on this Not a very cool looking website But if you download this thing and get this crime extension It allows you to send Uh, it gives you like a virtual midi instrument in the browser that you can send midi instructions to and then it plays it So the browser is actually not playing the sound Um a service which is running on my computer, which is interpreting the messages is playing the sound which is unfortunate Yeah, so you have to have that plugin and the extension installed. Um, but then Yeah, you can do cool stuff But yeah, I guess yeah, what I wanted to show was um Yeah, you can do cool stuff with web bluetooth. You can connect to devices You can probably connect to your your phone or your um or your your watch smartwatch and uh, you can query it figure out what what things what services it provides And then uh, pretend you can even send it messages. So for example, this thing allows Uh allows you to like configure it. So, um, you know different sensitivities For the different drums and positions and stuff I can send a message to these things which configures it or updates that I can send it a binary blob to update the firmware on it Um, so yeah, any devices that you have which speak bluetooth if you can manage to dig up the uh, The documentation for how their bluetooth protocol works. You can potentially write your own custom software for it um another one more interesting thing is um uh The uh, I found that uh, so see these things whenever I move one of these Is it's like it's the green ones are notes the blue ones are control messages. So that you'll notice that it sends like Um, sort of incrementally That's it. Um, it uses a midi Um, a midi, uh control message to communicate the battery level It's like they're sort of abusing the the midi protocol to communicate Um device information They also support actually querying the device information, but I didn't know that when I figured this out. Um, but the interesting thing here is that the uh I thought you know those little buttons, you know, it's kind of like a light on a real piece of hardware Um, you know, whenever something comes in it lights it and whenever the you know, and it sort of fades over time uh This was blocking the midi messages from being processed the css Uh, so that I thought was interesting. So I've had too many um too much css happening. Um And it was delaying my drum hits So I actually had to I had to modify my css to get my drum hits to be performant So anyone thought that was interesting. So that's that's all I wanted to show Thanks More questions on web bluetooth. When is it coming? I guess we've got to google that