Iframe & browsers

The panel iframe

VelvetLive.mount() creates it for you. If you build it yourself:

<iframe src="https://devlive.thinkbeyondcorporate.com/panel/#mt=MODEL_TOKEN"
        allow="bluetooth" referrerpolicy="no-referrer"
        style="border:0;width:100%;height:640px"></iframe>
  • allow="bluetooth" is required. Without it the browser never shows the toy picker; the panel says so.
  • The token goes after the #, never in the path or query.
  • Your page must be served over HTTPS.
  • If your page sends a Permissions-Policy header, it must not block Bluetooth for our origin, e.g. bluetooth=(self "https://devlive.thinkbeyondcorporate.com").
  • If your page sends a Content Security Policy, allow our origin in frame-src and script-src, and our API host (wss://devlive-api.thinkbeyondcorporate.com) in connect-src.
  • No sandbox attribute: the panel needs scripts, its own storage and Bluetooth.

The model can also open the panel in its own tab (the same URL). Then tips from live.js on your page still reach it.

Browsers

Toys connect over Web Bluetooth.

WorksDoesn't
Chrome, Edge, Opera on Windows, Mac, Linux, ChromeOSAny browser on iPhone or iPad
Chrome on AndroidFirefox, Safari

On a Mac, Chrome needs Bluetooth permission once: System Settings → Privacy & Security → Bluetooth → Google Chrome, then restart Chrome. A toy talks to one app at a time: the model should close Velvet Vibes on her phone first.

The panel keeps playing in a background tab. It stops the toy when the connection drops, when the page closes, and when she presses Stop; every command also times out by itself.