Embedding strudel

[yaxu]

It would be nice to be able to easily add working strudel code to e.g. a discourse forum (like https://club.tidalcycles.org) or wordpress blog via a plugin. Hope no-one minds me capturing some ideas from the discord chat:

• How to make a discourse plugin: https://meta.discourse.org/t/beginners-guide-to-creating-discourse-plugins-part-1-creating-a-basic-plugin/30515
• Iframe example from @felixroos : https://codesandbox.io/s/beautiful-raman-2mxo8b?file=/index.html
  • @felixroos: i could add a flag to the repl url that minimizes the ui for better embedding
  • @mindofmatthew: You don't even need to add a URL param, you can also check window.location !== window.parent.location
  • @yaxu: I like the play / reset / open in editor buttons in https://hydra-book.glitch.me/#/
  • @felixroos: it would also be really cool to have a simple web component that uses it's innerText to generate an iframe with strudel + hashed code - <strudel>cat(...)</strudel> this would allow embedding the repl in any html file by just adding a script tag

[felixroos]

we could add a package like @strudel.cycles/embed for the web component. Then the script can be imported easily from a cdn like unpkg or skypack

[felixroos]

done with https://github.com/tidalcycles/strudel/tree/main/packages/embed#strudelcyclesembed

[felixroos]

see #107