Library Setup

The StemmaWeb library adds a small API to p5.js that lets your sketches read from physical sensors connected via the Trinkey. It works in any environment that supports WebUSB — which today means Chromium-based browsers (Chrome, Edge, Opera).

The Library File

The library is a single JavaScript file. You can either reference it directly via CDN or download it and host it yourself.

CDN (always latest)

https://sebastian-lenz.github.io/stemma-web/download/stemma-web.p5.js
Download

WebUSB requires a secure context — the library only works on https:// pages or localhost.

Adding the Library to Your Sketch

Choose your environment:

The p5.js Web Editor lets you add external libraries by editing the sketch's index.html file.

  1. 1

    Open index.html

    In the left sidebar, click the ▶ Files arrow to expand the file list, then click index.html.

  2. 2

    Add the script tag

    Add a <script> tag for StemmaWeb after the p5.js script tag:

    <!-- already there -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.x.x/p5.js"></script>
    
    <!-- add this -->
    <script src="https://sebastian-lenz.github.io/stemma-web/download/stemma-web.p5.js"></script>
  3. 3

    Run your sketch

    Press ▶ Play. The StemmaWeb API is now available in sketch.js.