• I know some of you have had trouble with the instructions in the Quick Start so there's now another option.

    Web IDE Relay

    This allows you to use a phone or tablet (or any device that has Web Bluetooth) to access your Puck.js from a PC.

    Use as follows:

    • Open https://www.espruino.com/ide/relay on your phone. If you're using iOS you'll need to do this via the WebBLE web browser as Safari doesn't support Web Bluetooth.
    • Click the connect icon in the top left
    • Choose your Puck.js device
    • Now open https://www.espruino.com/ide on your PC
    • Copy the 8 digit 'relay key' that was displayed on your phone into Communications -> Relay Key in your Web IDE's settings on the PC
    • Now click the connect icon on the PC
    • Choose Web IDE Relay

    And enjoy programming Puck.js via your phone! Just make sure it doesn't go to sleep or you might lose your Bluetooth connection :)

    Hope that helps some of you out. It's still a bit 'beta', so if you have any suggestions/tweaks it'd be good to know.

  • https://www.youtube.com/watch?v=H8L8ft83­0hI

    It's also worth noting that the phone and PC don't have to be in the same place. You could be on the other side of the world programming Puck.js!

  • thanks @Gordon, nice work!

    I've tried with an ipad running /ide/relay and windows 10/Chrome for the web ide

    It took about 3 cycles to get it to work - however I did end up with a flashing red led!

    Then on ipad I get DISCONNECTED at the bottom.

    so you reconnect, and then need to enter the key again on the PC...

    Some feedback

    1. Please ask to update the bookmarks on WEBBLE to include https://www.espruino.com/ide/relay
    2. It doesn't look you can increase the font size on the relay key - I found it a bit hard to read
    3. There is no indication on the PC ide that the other end has disconnected? update - this did disconnect after sometime - quite a bit after the disconnect on the ipad
    4. Would it be possible to re-connect silently and retain the key so that it not needed to be re-entered?
      Perhaps the key could be picked up both ends from the url?
      Then it would not need to be typed into the settings?
      I realise there could be security implications here - just brain dumping
      if you don't update the key, and connect again on the PC - it says connected, but it isn't

      Device found (connectionId=undefined)
      [success] Connected to port Web IDE Relay
      >>> Connected to port Web IDE Relay

    So there seems to be no indication that the expired key or wrong key is used?

  • Odd about the repeated connects and disconnect - was the Puck nearby, or could it have had bad signal?

    I'll wait until it's a bit more stable before adding it to the bookmarks. It's trivial to add /relay to the end of the IDE URL and add it as a new bookmark though.

    It doesn't look you can increase the font size on the relay key - I found it a bit hard to read

    Hopefully I've just fixed that.

    There is no indication on the PC ide that the other end has disconnected?

    Good point - I thought it did, but looking at the code it doesn't.

    Would it be possible to re-connect silently and retain the key

    Reconnecting silently might be tricky with Web Bluetooth (as I guess it's entirely likely it would need user input?). The key should be retained - it is on Android I believe (it's stored in a cookie) but I wonder if WebBLE doesn't preserve cookies?

    So there seems to be no indication that the expired key or wrong key is used?

    Yes, I wasn't sure about that - I don't want people to be able to brute-force it to find other people's keys so for the moment I'm just leaving it with no response.

    If anyone does want to hack around on this, the code itself is here:

    relay: https://github.com/espruino/EspruinoWebI­DE/blob/gh-pages/relay/relay.js
    ide comms: https://github.com/espruino/EspruinoTool­s/blob/c57e60e94b6b324cbf1bd495f2365880a­805f2c3/core/serial_websocket.js

    It's not too difficult.

  • Having the key being able to be specified in the URL could work well - realistically it's only those on iOS that'd need it... Maybe at some point there could even be a QR code in the main IDE that generated a scannable link :)

  • Although i don't need it, this kind of efforts are always worth a donation. $5 sent.
    p.s. it's easy, just hit http://www.espruino.com/Donate .

    @Gordon Why not something like this below

    1 Attachment

    • donate.JPG
  • Thanks!

    :) that's a nice idea too! I don't have control of the forum itself at the moment, but stuff like that could be a good reason to start running the forum myself.

  • And some "like" emoticons, so I don't make too much noise with saying "great idea"

  • I was really interested in this option, tried it both combined with my LG G4 and the WebBLE app on my iPad, but was unable to get beyond the "connecting" dialog on my laptop.
    Don't really know where to look for debug info though.

  • The log on my laptop looks "normal", no errors, also no connection.

    1 Attachment

    • log_laptop.PNG
  • Log on my iPad, which also keeps on disconnecting while the puck is right beside it.

    1 Attachment

    • IMG_1084.PNG
  • I don't see any errors... Are you connecting on your laptop after connecting on the iPad - and are you absolutely sure the code you entered is the same on both devices?

    The IDE won't show you errors if the code is wrong - while it's annoying I decided not to report errors for incorrect codes to stop people brute-forcing every possible code to try and take control of other people's Pucks.

  • Hi Gordon,
    Can the Relay Key feature also be available on the Chrome extension and also the cli too?

  • Good question :)

    I'm not sure the chrome extension has been updated with it, but when I next do an update (or you manually install the version from GitHub) then yes, it'll work.

    With the command line tools I'm afraid it won't, because it's expecting to use the Web Browser's Websocket implementation which won't exist in Node.js. I guess with a bit of work it could do (especially if there's a Browser-compatible websocket implementation for Node.js?)

  • Not really, am using the latest version and it doesn't have the Relay feature.

    Am not sure if there is a module for that, maybe i check it out.

  • That's odd then. Out of interest - is there a reason you need to use the Chrome app? With the relay you shouldn't need it to access hardware directly

  • Hi,
    I have a problem that is no relay key input field on the web IDE. Does it normal? I need help... Thanks all who help me!

    1 Attachment

    • 擷取.PNG
  • And you're accessing it via https://www.espruino.com/ide/ ? The Chrome Web App version of the IDE won't have a relay option in it.

    Please could you go to the developer console and paste up the messages displayed in it?

  • Hi Gordon,
    Yes, I'm accessing it via the URL.

    Following is the console log when the web IDE has been load,

    serial_audio: Audio Sample rate : 48000
    serial_audio: Audio Serial Baud 9600 Bit time 5
    No chrome.sockets - serial_socket disabled
    Running from github/espruino.com - WebSocket support disabled
    No chrome.storage API - disabling Offline mode
    Initialising SettingsConsole
    Initialising Utils
    Initialising Config
    Initialising Notifications
    Initialising Status
    Initialising App
    Initialising File
    Initialising Code
    Initialising Serial

    • Initialising Serial Audio
    • Initialising Serial Web Bluetooth
      Initialising Terminal
      Initialising CodeWriter
      Initialising Modules
      Initialising Env
      Initialising Flasher
      Initialising EditorBlockly
      Initialising EditorJavaScript
      Initialising Send
      Initialising MenuPortSelector
      Initialising MenuSettings
      Initialising MenuFlasher
      Initialising SettingsAbout
      Initialising SettingsFlasher
      Initialising BoardJSON
      Initialising VersionChecker
      Initialising Compiler
      Initialising Assembler
      Initialising GetGitHub
      Initialising SetTime
      Initialising Unicode
      Initialising Minify
      Initialising SaveOnSend
      Initialising Tutorial
      Initialising Webcam
      Initialising FontSize
      Initialising UiMode
      Initialising URLHandler
      Initialising CodeLink
      Initialising Project
      Initialising Testing
      Initialising Notification_Sound
      Initialising Tern
      Initialising Debugger
      Initialising Tour
      Initialising HelpLinks
      Initialising Arrows
      No code in storage.
      Handling URL "https://www.espruino.com/ide/"
      Service worker active

    By the way, my OS is win7 64bit with Google Chrome version 59.0.3071.115.
    Thank you for helping!

  • Hi Gordon,
    Which version of IDE will have the relay option?

  • @user80065

    I too am unable to locate the relay option under Communications using the Web+IDE version https://www.espruino.com/ide/

  • Try https://www.espruino.com/ide/relay/
    under settings, COMMUNICATIONS it is.

  • Hi Frida,
    Thank you for your helping.
    I think the "relay" web is running on the relay phone, but I'm trying the web of PC side now.
    I can't find any inputing field for building the communication between phone and PC side.
    Is my understanding about Espruino wrong?

  • @user80065,

    I agree with you that in step #1 for the PC side that it is written
    and that the 'Relay Key' edit field is not present there.

    Maybe @Frida is trying to imply that https://www.espruino.com/ide/relay/ is used on both ends perhaps, and that step #1 has 'improved' since five months ago?

    Such that the relay link-app is used to pair the two, then use https://www.espruino.com/ide/ to access perhaps?

    The input field is under Settings >> Communications>>Relay Key:: (Last Entry)
    as Frida indicates.

    My outbound BLE device can't connect, so I am unable to test this idea on PC side.

  • @Robin - if you don't have an Android/iOS device that can act as the other end of the Relay (which you said you didn't in other posts?) then I'm afraid the Relay option won't be much use to you.

    The Relay Key option should be here https://www.espruino.com/ide/

    However, it looks like I'd made a recent IDE change which has disabled it - and the cached version on my PC was still showing it as working. I have since tweaked it so it should be working.

    Go to https://www.espruino.com/ide/ and Ctrl-click the reload button - that should force a full reload of the IDE, and after that you should hopefully see the Relay Key option.

    1 Attachment

    • Screenshot at 2017-08-07 10-03-19.png
  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview

How to use Puck.js if your PC/Mac doesn't work with Web Bluetooth (Web IDE Relay)

Posted by Avatar for Gordon @Gordon