Strudel ~ TidalCycles for the web

An experiment in making a Tidal using web technologies.

and this is the coolest part of having a Tidal for the web:

To quote the README.md in full:

@strudel.cycles/embed
This package contains a embeddable web component for the Strudel REPL.

Usage
Either install with npm i @strudel.cycles/embed or just use a cdn to import the script:

<script src=“https://unpkg.com/@strudel.cycles/embed@latest”>
<strudel-repl>
<!–
“a4 [a3 c3] a3 c3”.color(‘#F9D649’)
.sub(“<7 12 5 12>”.slow(2))
.off(1/4,x=>x.add(7).color(“#FFFFFF #0C3AA1 #C63928”))
.off(1/8,x=>x.add(12).color(‘#215CB6’))
.slow(2)
.legato(sine.range(0.3, 2).slow(28))
.wave(“sawtooth square”.fast(2))
.filter(‘lowpass’, cosine.range(500,4000).slow(16))
.out()
.pianoroll({minMidi:20,maxMidi:120,background:‘#202124’})

</strudel-repl>
Note that the Code is placed inside HTML comments to prevent the browser from treating it as HTML.

and what this means is you can embed a strudel REPL into web pages like they do in the tutorial. And you can also potentially embed strudel REPLs into Discourse posts, if @moderators were to do the necessary. You can see what that looks like in this Tidal Club thread.

Might be kinda fun for lines, eh?

32 Likes

Thanks for sharing! Strudel is still less than one year old, but thanks to the work of Felix Roos, is developing super fast.

Here’s the discourse plugin :slight_smile: GitHub - tidalcycles/discourse-strudel: Strudel plugin for the discourse forum

6 Likes

I’m concerned about the security implications of user-contributed code. Could an attacker create a code snippet that executes arbitrary JS at the click of a button?

@nathan that’s a great question. I asked it over on Tidal Club.

In summary yes, but that code is sandboxed so couldn’t do anything apart from be a bit annoying.

1 Like