Publish

- @strudel/codemirror@1.1.0
 - @strudel/core@1.1.0
 - @strudel/csound@1.1.0
 - @strudel/draw@1.1.0
 - @strudel/embed@1.1.0
 - hs2js@0.1.0
 - @strudel/hydra@1.1.0
 - @strudel/midi@1.1.0
 - @strudel/mini@1.1.0
 - @strudel/osc@1.1.0
 - @strudel/repl@1.1.0
 - @strudel/sampler@0.1.0
 - @strudel/serial@1.1.0
 - @strudel/soundfonts@1.1.0
 - superdough@1.1.0
 - @strudel/tidal@0.1.0
 - @strudel/tonal@1.1.0
 - @strudel/transpiler@1.1.0
 - @strudel/web@1.1.0
 - @strudel/webaudio@1.1.0
 - @strudel/xen@1.1.0

.eslintignore

@@ -21,4 +21,5 @@ vite.config.js
 /src-tauri/target/**/*
 reverbGen.mjs
 hydra.mjs
-jsdoc-synonyms.js
+jsdoc-synonyms.js
+packages/hs2js/src/hs2js.mjs

.eslintrc.json

@@ -1,5 +1,6 @@
 {
   "env": {
+    "node": true,
     "browser": true,
     "es2021": true
   },

.gitignore

@@ -127,3 +127,6 @@ fabric.properties
 .idea/caches/build_file_checksums.ser
 
 # END JetBrains -> BEGIN JetBrains
+
+samples/*
+!samples/README.md

.prettierignore

@@ -10,3 +10,4 @@ paper
 pnpm-lock.yaml
 pnpm-workspace.yaml
 **/dev-dist
+website/.astro

CONTRIBUTING.md

@@ -114,7 +114,7 @@ You can run the same check with `pnpm check`
 ## Package Workflow
 
 The project is split into multiple [packages](https://github.com/tidalcycles/strudel/tree/main/packages) with independent versioning.
-When you run `pnpm i` on the root folder, [pnpm workspaces](https://pnpm.io/workspaces) will install all dependencies of all subpackages. This will allow any js file to import `@strudel.cycles/<package-name>` to get the local version,
+When you run `pnpm i` on the root folder, [pnpm workspaces](https://pnpm.io/workspaces) will install all dependencies of all subpackages. This will allow any js file to import `@strudel/<package-name>` to get the local version,
 allowing to develop multiple packages at the same time.
 
 ## Package Publishing

README.md

@@ -2,37 +2,28 @@
 
 [![Strudel test status](https://github.com/tidalcycles/strudel/actions/workflows/test.yml/badge.svg)](https://github.com/tidalcycles/strudel/actions)
 
-An experiment in making a [Tidal](https://github.com/tidalcycles/tidal/) using web technologies. This software is slowly stabilising, but please continue to tread carefully.
+An experiment in making a [Tidal](https://github.com/tidalcycles/tidal/) using web technologies. This software is a bit more stable now, but please continue to tread carefully.
 
 - Try it here: <https://strudel.cc>
 - Docs: <https://strudel.cc/learn>
 - Technical Blog Post: <https://loophole-letters.vercel.app/strudel>
 - 1 Year of Strudel Blog Post: <https://loophole-letters.vercel.app/strudel1year>
+- 2 Years of Strudel Blog Post: <https://strudel.cc/blog/#year-2>
 
 ## Running Locally
 
 After cloning the project, you can run the REPL locally:
 
 ```bash
-pnpm run setup
-pnpm run repl
+pnpm i
+pnpm dev
 ```
 
 ## Using Strudel In Your Project
 
-There are multiple npm packages you can use to use strudel, or only parts of it, in your project:
+This project is organized into many [packages](./packages), which are also available on [npm](https://www.npmjs.com/search?q=%40strudel).
 
-- [`core`](./packages/core/): tidal pattern engine
-- [`mini`](./packages/mini): mini notation parser + core binding
-- [`transpiler`](./packages/transpiler): user code transpiler
-- [`webaudio`](./packages/webaudio): webaudio output
-- [`osc`](./packages/osc): bindings to communicate via OSC
-- [`midi`](./packages/midi): webmidi bindings
-- [`serial`](./packages/serial): webserial bindings
-- [`tonal`](./packages/tonal): tonal functions
-- ... [and there are more](./packages/)
-
-Click on the package names to find out more about each one.
+Read more about how to use these in your own project [here](https://strudel.cc/technical-manual/project-start).
 
 ## Contributing
 

bench/tunes.bench.mjs

@@ -0,0 +1,22 @@
+import { queryCode, testCycles } from '../test/runtime.mjs';
+import * as tunes from '../website/src/repl/tunes.mjs';
+import { describe, bench } from 'vitest';
+import { calculateTactus } from '../packages/core/index.mjs';
+
+const tuneKeys = Object.keys(tunes);
+
+describe('renders tunes', () => {
+  tuneKeys.forEach((key) => {
+    describe(key, () => {
+      calculateTactus(true);
+      bench(`+tactus`, async () => {
+        await queryCode(tunes[key], testCycles[key] || 1);
+      });
+      calculateTactus(false);
+      bench(`-tactus`, async () => {
+        await queryCode(tunes[key], testCycles[key] || 1);
+      });
+      calculateTactus(true);
+    });
+  });
+});

examples/buildless/basic.html

@@ -7,7 +7,7 @@
 />
 <div id="output"></div>
 <script type="module">
-  const strudel = await import('https://cdn.skypack.dev/@strudel.cycles/core@0.6.8');
+  const strudel = await import('https://cdn.skypack.dev/@strudel/core@0.6.8');
   Object.assign(window, strudel); // assign all strudel functions to global scope to use with eval
   const input = document.getElementById('text');
   const getEvents = () => {

examples/buildless/canvas.html

@@ -8,7 +8,7 @@
   />
   <canvas id="canvas"></canvas>
   <script type="module">
-    const strudel = await import('https://cdn.skypack.dev/@strudel.cycles/core@0.6.8');
+    const strudel = await import('https://cdn.skypack.dev/@strudel/core@0.6.8');
     // this adds all strudel functions to the global scope, to be used by eval
     Object.assign(window, strudel);
     // setup elements

examples/buildless/headless-simple.html

@@ -1,10 +1,31 @@
 <!doctype html>
-<button id="play">play</button>
-<button id="stop">stop</button>
-<script type="module">
-  import { initStrudel } from 'https://cdn.skypack.dev/@strudel/web@0.8.2';
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <!-- <script src="../../packages/web/dist/index.js"></script> -->
+    <script src="https://unpkg.com/@strudel/web@1.0.3"></script>
+  </head>
+  <body style="background: #222">
+    <button id="play">play</button>
+    <button id="stop">stop</button>
+    <script>
+      strudel.initStrudel();
+      document.getElementById('play').addEventListener('click', () =>
+        evaluate(`
+//@title washover @by Switch Angel 
+//@social https://www.instagram.com/_switch_angel/
 
-  initStrudel();
-  document.getElementById('play').addEventListener('click', () => evaluate('note("c a f e").jux(rev)'));
-  document.getElementById('play').addEventListener('stop', () => hush());
-</script>
+n("{0 1 3 5 2 }%16")
+  .add(n(tri.range(0, 6).slow(3)))
+  .scale("C4:pentatonic")
+  .sound("sawtooth").att(saw.range(0, 0.05).fast(6))
+  .release(3).pan(rand).decay(rand.range(0.1, 0.3))
+  .lpf(tri.range(200, 8000).slow(5)).lpq(0)
+  .gain(.4).vib(1).vibmod(.1)
+  .scope({pos:.5})
+`),
+      );
+      document.getElementById('stop').addEventListener('click', () => strudel.hush());
+    </script>
+  </body>
+</html>

examples/buildless/headless-with-samples.html

@@ -1,16 +1,24 @@
 <!doctype html>
-<button id="a">A</button>
-<button id="b">B</button>
-<button id="c">C</button>
-<button id="stop">stop</button>
-<script type="module">
-  import { initStrudel } from 'https://cdn.skypack.dev/@strudel/web@0.8.2';
-  initStrudel({
-    prebake: () => samples('github:tidalcycles/Dirt-Samples/master'),
-  });
-  const click = (id, action) => document.getElementById(id).addEventListener('click', action);
-  click('a', () => evaluate(`s('bd,jvbass(3,8)').jux(rev)`));
-  click('b', () => s('bd*2,hh(3,4),jvbass(5,8,1)').jux(rev).play());
-  click('c', () => s('bd*2,hh(3,4),jvbass:[0 4](5,8,1)').jux(rev).stack(s('~ sd')).play());
-  click('stop', () => hush());
-</script>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <!-- <script src="../../packages/web/dist/index.js"></script> -->
+    <script src="https://unpkg.com/@strudel/web@1.0.3"></script>
+  </head>
+  <body style="background: #222">
+    <button id="a">A</button>
+    <button id="b">B</button>
+    <button id="c">C</button>
+    <button id="stop">stop</button>
+    <script>
+      initStrudel({
+        prebake: () => samples('github:tidalcycles/dirt-samples'),
+      });
+      const click = (id, action) => document.getElementById(id).addEventListener('click', action);
+      click('a', () => evaluate(`s('bd,jvbass(3,8)').jux(rev)`));
+      click('b', () => s('bd*2,hh(3,4),jvbass(5,8,1)').jux(rev).play());
+      click('c', () => s('bd*2,hh(3,4),jvbass:[0 4](5,8,1)').jux(rev).stack(s('~ sd')).play());
+      click('stop', () => hush());
+    </script>
+  </body>
+</html>

examples/buildless/hs2js.html

@@ -0,0 +1,9 @@
+<script src="https://unpkg.com/hs2js@0.0.4"></script>
+<button id="hello">hello</button>
+<script>
+  hs2js.setBase('https://unpkg.com/hs2js@0.0.4/dist/');
+  hs2js.loadParser();
+  document.getElementById('hello').addEventListener('click', () => {
+    hs2js.evaluate('alert "hello from haskell!"');
+  });
+</script>

examples/buildless/minimal-repl.html

@@ -16,38 +16,45 @@
     </div>
     <div id="output"></div>
     <script type="module">
-      import { controls, repl, evalScope } from 'https://cdn.skypack.dev/@strudel.cycles/core@0.6.8';
-      import { mini } from 'https://cdn.skypack.dev/@strudel.cycles/mini@0.6.0';
-      import { transpiler } from 'https://cdn.skypack.dev/@strudel.cycles/transpiler@0.6.0';
+      // TODO: refactor to use newer version without controls import
+      import { controls, repl, evalScope } from 'https://cdn.skypack.dev/@strudel/core@0.11.0';
+      import { mini } from 'https://cdn.skypack.dev/@strudel/mini@0.11.0';
+      import { transpiler } from 'https://cdn.skypack.dev/@strudel/transpiler@0.11.0';
       import {
         getAudioContext,
         webaudioOutput,
         initAudioOnFirstClick,
-      } from 'https://cdn.skypack.dev/@strudel.cycles/webaudio@0.6.0';
+        registerSynthSounds,
+      } from 'https://cdn.skypack.dev/@strudel/webaudio@0.11.0';
 
-      initAudioOnFirstClick();
       const ctx = getAudioContext();
       const input = document.getElementById('text');
       input.innerHTML = getTune();
 
-      evalScope(
+      const loadModules = evalScope(
         controls,
-        import('https://cdn.skypack.dev/@strudel.cycles/core@0.6.8'),
-        import('https://cdn.skypack.dev/@strudel.cycles/mini@0.6.0'),
-        import('https://cdn.skypack.dev/@strudel.cycles/tonal@0.6.0'),
-        import('https://cdn.skypack.dev/@strudel.cycles/webaudio@0.6.0'),
+        import('https://cdn.skypack.dev/@strudel/core@0.11.0'),
+        import('https://cdn.skypack.dev/@strudel/mini@0.11.0'),
+        import('https://cdn.skypack.dev/@strudel/tonal@0.11.0'),
+        import('https://cdn.skypack.dev/@strudel/webaudio@0.11.0'),
       );
 
+      const initAudio = Promise.all([initAudioOnFirstClick(), registerSynthSounds()]);
+
       const { evaluate } = repl({
         defaultOutput: webaudioOutput,
         getTime: () => ctx.currentTime,
         transpiler,
       });
-      document.getElementById('start').addEventListener('click', () => evaluate(input.value));
+      document.getElementById('start').addEventListener('click', async () => {
+        await loadModules;
+        await initAudio;
+        evaluate(input.value);
+      });
 
       function getTune() {
-        return `await samples('github:tidalcycles/Dirt-Samples/master')
-
+        return `samples('github:tidalcycles/dirt-samples')
+setcps(1);
 stack(
   // amen
   n("0 1 2 3 4 5 6 7")

examples/buildless/tidal.html

@@ -0,0 +1,98 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>tidal.html</title>
+  </head>
+  <body style="margin: 0; padding: 0">
+    <textarea id="code" style="width: 100%; height: 200px"></textarea>
+    <pre id="result"></pre>
+    <script src="https://unpkg.com/hs2js@0.0.8"></script>
+    <script src="https://unpkg.com/@strudel/web@1.0.3"></script>
+    <script>
+      const { initStrudel } = strudel;
+      const { run, parse, setBase, loadParser } = hs2js;
+      setBase('https://unpkg.com/hs2js@0.0.4/dist/');
+      const ready = loadParser();
+      initStrudel({
+        prebake: () => samples('github:tidalcycles/dirt-samples'),
+      });
+
+      const textarea = document.getElementById('code');
+      if (window.location.hash) {
+        textarea.value = atob(window.location.hash.slice(1));
+      } else {
+        textarea.value = 'd1 $ s "jvbass(3,8)"';
+      }
+      textarea.addEventListener('input', (e) => {
+        window.location.hash = btoa(e.target.value);
+        update();
+      });
+      update();
+
+      function getInfixOperators() {
+        let operators = {
+          '>': 'set',
+          '#': 'set',
+          '+': 'add',
+          '-': 'sub',
+          '*': 'mul',
+          '/': 'div',
+        };
+        let alignments = {
+          in: (s) => '|' + s,
+          out: (s) => s + '|',
+          mix: (s) => '|' + s + '|',
+        };
+        let ops = {};
+        Object.entries(operators).forEach(([o, name]) => {
+          // operator without alignment
+          ops[o] = (l, r) => reify(l)[name](reify(r));
+          Object.entries(alignments).forEach(([a, getSymbol]) => {
+            // get symbol with alignment
+            let symbol = getSymbol(o);
+            ops[symbol] = (l, r) => reify(l)[name][a](reify(r));
+          });
+        });
+        ops['~>'] = (l, r) => reify(l).late(reify(r));
+        ops['<~'] = (l, r) => reify(l).early(reify(r));
+        ops['<$>'] = (l, r) => reify(r).fmap(l).outerJoin(); // is this right?
+        return ops;
+      }
+      const ops = getInfixOperators();
+
+      async function update() {
+        let result, tree;
+        await ready;
+        try {
+          tree = parse(textarea.value);
+        } catch (err) {
+          console.warn('parse error');
+          console.error(err);
+        }
+        console.log('parsed tree');
+        console.log(tree.rootNode.toString());
+        try {
+          let patterns = {};
+          window.p = (name, pattern) => {
+            patterns[name] = pattern;
+          };
+          window.d1 = (pat) => window.p(1, pat);
+          window.d2 = (pat) => window.p(2, pat);
+          window.d3 = (pat) => window.p(3, pat);
+          window.rot = late;
+          result = run(tree.rootNode, window, ops);
+          if (Object.values(patterns).length) {
+            stack(...Object.values(patterns)).play();
+          }
+        } catch (err) {
+          console.warn('eval error');
+          console.error(err);
+          result = 'ERROR: ' + err.message;
+        }
+        document.getElementById('result').innerHTML = 'Result: ' + result;
+      }
+    </script>
+  </body>
+</html>

examples/buildless/web-component-iframe.html

@@ -1,4 +1,4 @@
-<script src="https://unpkg.com/@strudel.cycles/embed@latest"></script>
+<script src="https://unpkg.com/@strudel/embed@0.11.0"></script>
 <!-- <script src="./embed.js"></script> -->
 <strudel-repl>
   <!--

examples/buildless/web-component-no-iframe.html

@@ -1,4 +1,4 @@
-<script src="https://unpkg.com/@strudel/repl@0.9.4"></script>
+<script src="https://unpkg.com/@strudel/repl@1.0.2"></script>
 <strudel-editor>
   <!--
 // @date 23-08-15

examples/buildless/web.html

@@ -0,0 +1,8 @@
+<script src="https://unpkg.com/@strudel/web@1.0.3"></script>
+<button id="play">PLAY</button>
+<script>
+  initStrudel({
+    prebake: () => samples('github:tidalcycles/dirt-samples'),
+  });
+  document.getElementById('play').addEventListener('click', () => s('bd sd').play());
+</script>

examples/codemirror-repl/main.js

@@ -1,11 +1,12 @@
 import { StrudelMirror } from '@strudel/codemirror';
 import { funk42 } from './tunes';
-import { drawPianoroll, evalScope, controls } from '@strudel.cycles/core';
+import { evalScope } from '@strudel/core';
+import { drawPianoroll } from '@strudel/draw';
 import './style.css';
-import { initAudioOnFirstClick } from '@strudel.cycles/webaudio';
-import { transpiler } from '@strudel.cycles/transpiler';
-import { getAudioContext, webaudioOutput, registerSynthSounds } from '@strudel.cycles/webaudio';
-import { registerSoundfonts } from '@strudel.cycles/soundfonts';
+import { initAudioOnFirstClick } from '@strudel/webaudio';
+import { transpiler } from '@strudel/transpiler';
+import { getAudioContext, webaudioOutput, registerSynthSounds } from '@strudel/webaudio';
+import { registerSoundfonts } from '@strudel/soundfonts';
 
 // init canvas
 const canvas = document.getElementById('roll');
@@ -25,11 +26,11 @@ const editor = new StrudelMirror({
   prebake: async () => {
     initAudioOnFirstClick(); // needed to make the browser happy (don't await this here..)
     const loadModules = evalScope(
-      controls,
-      import('@strudel.cycles/core'),
-      import('@strudel.cycles/mini'),
-      import('@strudel.cycles/tonal'),
-      import('@strudel.cycles/webaudio'),
+      import('@strudel/core'),
+      import('@strudel/draw'),
+      import('@strudel/mini'),
+      import('@strudel/tonal'),
+      import('@strudel/webaudio'),
     );
     await Promise.all([loadModules, registerSynthSounds(), registerSoundfonts()]);
   },

examples/codemirror-repl/package.json

@@ -13,11 +13,12 @@
   },
   "dependencies": {
     "@strudel/codemirror": "workspace:*",
-    "@strudel.cycles/core": "workspace:*",
-    "@strudel.cycles/mini": "workspace:*",
-    "@strudel.cycles/soundfonts": "workspace:*",
-    "@strudel.cycles/tonal": "workspace:*",
-    "@strudel.cycles/transpiler": "workspace:*",
-    "@strudel.cycles/webaudio": "workspace:*"
+    "@strudel/core": "workspace:*",
+    "@strudel/draw": "workspace:*",
+    "@strudel/mini": "workspace:*",
+    "@strudel/soundfonts": "workspace:*",
+    "@strudel/tonal": "workspace:*",
+    "@strudel/transpiler": "workspace:*",
+    "@strudel/webaudio": "workspace:*"
   }
 }

examples/codemirror-repl/tunes.mjs

@@ -1,6 +1,6 @@
 export const bumpStreet = `// froos - "22 bump street", licensed with CC BY-NC-SA 4.0
-await samples('github:felixroos/samples/main')
-await samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
+samples('github:felixroos/samples')
+samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
 
 "<[0,<6 7 9>,13,<17 20 22 26>]!2>/2"
   // make it 22 edo
@@ -33,8 +33,8 @@ await samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tid
 
 export const trafficFlam = `// froos - "traffic flam", licensed with CC BY-NC-SA 4.0
 
-await samples('github:felixroos/samples/main')
-await samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
+samples('github:felixroos/samples')
+samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
 
 addVoicings('hip', {
   m11: ['2M 3m 4P 7m'],
@@ -69,8 +69,8 @@ export const funk42 = `// froos - how to funk in 42 lines of code
 // adapted from "how to funk in two minutes" by marc rebillet https://www.youtube.com/watch?v=3vBwRfQbXkg
 // thanks to peach for the transcription: https://www.youtube.com/watch?v=8eiPXvIgda4
 
-await samples('github:felixroos/samples/main')
-await samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
+samples('github:felixroos/samples')
+samples('https://strudel.cc/tidal-drum-machines.json', 'github:ritchse/tidal-drum-machines/main/machines/')
 
 setcps(.5)
 

examples/headless-repl/index.html

@@ -15,7 +15,7 @@
     <script type="module">
       import { initStrudel } from '@strudel/web';
       initStrudel({
-        prebake: () => samples('github:tidalcycles/Dirt-Samples/master'),
+        prebake: () => samples('github:tidalcycles/dirt-samples'),
       });
 
       const click = (id, action) => document.getElementById(id).addEventListener('click', action);

examples/minimal-repl/main.js

@@ -1,20 +1,15 @@
-import { controls, repl, evalScope } from '@strudel.cycles/core';
-import { getAudioContext, webaudioOutput, initAudioOnFirstClick } from '@strudel.cycles/webaudio';
-import { transpiler } from '@strudel.cycles/transpiler';
+import { repl, evalScope } from '@strudel/core';
+import { getAudioContext, webaudioOutput, initAudioOnFirstClick, registerSynthSounds } from '@strudel/webaudio';
+import { transpiler } from '@strudel/transpiler';
 import tune from './tune.mjs';
 
 const ctx = getAudioContext();
 const input = document.getElementById('text');
 input.innerHTML = tune;
 initAudioOnFirstClick();
+registerSynthSounds();
 
-evalScope(
-  controls,
-  import('@strudel.cycles/core'),
-  import('@strudel.cycles/mini'),
-  import('@strudel.cycles/webaudio'),
-  import('@strudel.cycles/tonal'),
-);
+evalScope(import('@strudel/core'), import('@strudel/mini'), import('@strudel/webaudio'), import('@strudel/tonal'));
 
 const { evaluate } = repl({
   defaultOutput: webaudioOutput,

examples/minimal-repl/package.json

@@ -13,10 +13,10 @@
     "vite": "^5.0.10"
   },
   "dependencies": {
-    "@strudel.cycles/core": "workspace:*",
-    "@strudel.cycles/mini": "workspace:*",
-    "@strudel.cycles/transpiler": "workspace:*",
-    "@strudel.cycles/webaudio": "workspace:*",
-    "@strudel.cycles/tonal": "workspace:*"
+    "@strudel/core": "workspace:*",
+    "@strudel/mini": "workspace:*",
+    "@strudel/transpiler": "workspace:*",
+    "@strudel/webaudio": "workspace:*",
+    "@strudel/tonal": "workspace:*"
   }
 }

examples/minimal-repl/tune.mjs

@@ -1,5 +1,5 @@
-export default `await samples('github:tidalcycles/Dirt-Samples/master')
-
+export default `samples('github:tidalcycles/dirt-samples')
+setcps(1)
 stack(
   // amen
   n("0 1 2 3 4 5 6 7")

examples/superdough/index.html

@@ -12,7 +12,7 @@
 
       const init = Promise.all([
         initAudioOnFirstClick(),
-        samples('github:tidalcycles/Dirt-Samples/master'),
+        samples('github:tidalcycles/dirt-samples'),
         registerSynthSounds(),
       ]);
 

examples/tidal-repl/.gitignore

@@ -0,0 +1,27 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+public/tree-sitter.wasm
+public/tree-sitter-haskell.wasm

examples/tidal-repl/README.md

@@ -0,0 +1,10 @@
+# @strudel/tidal
+
+This is an experiment in implementing tree-sitter for parsing haskell.
+
+```sh
+pnpm i
+cd haskell
+pnpm copy-wasm
+pnpm dev
+```

examples/tidal-repl/index.html

@@ -0,0 +1,32 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Tree sitter test</title>
+    <style>
+      body {
+        background-color: #121213;
+        color: white;
+      }
+      textarea {
+        padding: 10px;
+        color: white;
+        background-color: transparent;
+        outline: none;
+      }
+      a {
+        color: white;
+      }
+    </style>
+  </head>
+  <body style="margin: 0; padding: 0">
+    <textarea id="code" style="width: 100%; height: 200px"></textarea>
+    <pre id="result"></pre>
+    <script
+      type="module"
+      src="/main.js
+    "
+    ></script>
+  </body>
+</html>

examples/tidal-repl/main.js

@@ -0,0 +1,83 @@
+import { run, parse, loadParser } from 'hs2js';
+import { initStrudel, reify, late, samples, stack } from '@strudel/web';
+
+initStrudel({
+  prebake: () => samples('github:tidalcycles/dirt-samples'),
+});
+
+const ready = loadParser();
+
+const textarea = document.getElementById('code');
+if (window.location.hash) {
+  textarea.value = atob(window.location.hash.slice(1));
+} else {
+  textarea.value = 'd1 $ s "jvbass(3,8)"';
+}
+textarea.addEventListener('input', (e) => {
+  window.location.hash = btoa(e.target.value);
+  update();
+});
+update();
+
+function getInfixOperators() {
+  let operators = {
+    '>': 'set',
+    '#': 'set',
+    '+': 'add',
+    '-': 'sub',
+    '*': 'mul',
+    '/': 'div',
+  };
+  let alignments = {
+    in: (s) => '|' + s,
+    out: (s) => s + '|',
+    mix: (s) => '|' + s + '|',
+  };
+  let ops = {};
+  Object.entries(operators).forEach(([o, name]) => {
+    // operator without alignment
+    ops[o] = (l, r) => reify(l)[name](reify(r));
+    Object.entries(alignments).forEach(([a, getSymbol]) => {
+      // get symbol with alignment
+      let symbol = getSymbol(o);
+      ops[symbol] = (l, r) => reify(l)[name][a](reify(r));
+    });
+  });
+  ops['~>'] = (l, r) => reify(l).late(reify(r));
+  ops['<~'] = (l, r) => reify(l).early(reify(r));
+  ops['<$>'] = (l, r) => reify(r).fmap(l).outerJoin(); // is this right?
+  return ops;
+}
+const ops = getInfixOperators();
+
+async function update() {
+  let result, tree;
+  await ready;
+  try {
+    tree = parse(textarea.value);
+  } catch (err) {
+    console.warn('parse error');
+    console.error(err);
+  }
+  console.log('parsed tree');
+  console.log(tree.rootNode.toString());
+  try {
+    let patterns = {};
+    window.p = (name, pattern) => {
+      patterns[name] = pattern;
+    };
+    window.d1 = (pat) => window.p(1, pat);
+    window.d2 = (pat) => window.p(2, pat);
+    window.d3 = (pat) => window.p(3, pat);
+    window.rot = late;
+    result = run(tree.rootNode, window, ops);
+    if (Object.values(patterns).length) {
+      stack(...Object.values(patterns)).play();
+    }
+  } catch (err) {
+    console.warn('eval error');
+    console.error(err);
+    result = 'ERROR: ' + err.message;
+  }
+  document.getElementById('result').innerHTML = 'Result: ' + result;
+}

examples/tidal-repl/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "tidal-repl",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "pnpm copy-wasm && vite build",
+    "preview": "vite preview",
+    "copy-wasm": "cp node_modules/hs2js/dist/tree-sitter.wasm public && cp node_modules/hs2js/dist/tree-sitter-haskell.wasm public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tidalcycles/strudel.git"
+  },
+  "keywords": [
+    "titdalcycles",
+    "strudel",
+    "pattern",
+    "livecoding",
+    "algorave"
+  ],
+  "author": "Felix Roos <flix91@gmail.com>",
+  "license": "AGPL-3.0-or-later",
+  "bugs": {
+    "url": "https://github.com/tidalcycles/strudel/issues"
+  },
+  "homepage": "https://github.com/tidalcycles/strudel#readme",
+  "dependencies": {
+    "@strudel/web": "workspace:*",
+    "hs2js": "workspace:*"
+  },
+  "devDependencies": {
+    "vite": "^5.0.8"
+  }
+}

examples/tidal-repl/public/README.md

@@ -0,0 +1,3 @@
+# public
+
+this file is just here to make sure the public folder exists

index.mjs

@@ -1,15 +1,20 @@
 // this barrel export is currently only used to find undocumented exports
+export * from './packages/codemirror/index.mjs';
 export * from './packages/core/index.mjs';
 export * from './packages/csound/index.mjs';
-export * from './packages/embed/index.mjs';
 export * from './packages/desktopbridge/index.mjs';
+export * from './packages/draw/index.mjs';
+export * from './packages/embed/index.mjs';
+export * from './packages/hydra/index.mjs';
 export * from './packages/midi/index.mjs';
 export * from './packages/mini/index.mjs';
 export * from './packages/osc/index.mjs';
-export * from './packages/react/index.mjs';
+export * from './packages/repl/index.mjs';
 export * from './packages/serial/index.mjs';
 export * from './packages/soundfonts/index.mjs';
+export * from './packages/superdough/index.mjs';
 export * from './packages/tonal/index.mjs';
 export * from './packages/transpiler/index.mjs';
+export * from './packages/web/index.mjs';
 export * from './packages/webaudio/index.mjs';
 export * from './packages/xen/index.mjs';

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@strudel.cycles/monorepo",
+  "name": "@strudel/monorepo",
   "version": "0.5.0",
   "private": true,
   "description": "Port of tidalcycles to javascript",
@@ -11,6 +11,7 @@
     "test": "npm run pretest && vitest run --version",
     "test-ui": "npm run pretest && vitest --ui",
     "test-coverage": "npm run pretest && vitest --coverage",
+    "bench": "npm run pretest && vitest bench",
     "snapshot": "npm run pretest && vitest run -u --silent",
     "repl": "npm run prestart && cd website && npm run dev",
     "start": "npm run prestart && cd website && npm run dev",
@@ -25,6 +26,7 @@
     "format-check": "prettier --check .",
     "report-undocumented": "npm run jsdoc-json && node jsdoc/undocumented.mjs > undocumented.json",
     "check": "npm run format-check && npm run lint && npm run test",
+    "sampler": "cd samples && node ../packages/sampler/sample-server.mjs",
     "iclc": "cd paper && pandoc --template=pandoc/iclc.html --citeproc  --number-sections iclc2023.md -o iclc2023.html && pandoc --template=pandoc/iclc.latex --citeproc --number-sections iclc2023.md -o iclc2023.pdf"
   },
   "repository": {
@@ -45,18 +47,18 @@
   },
   "homepage": "https://strudel.cc",
   "dependencies": {
-    "@strudel.cycles/core": "workspace:*",
-    "@strudel.cycles/mini": "workspace:*",
-    "@strudel.cycles/tonal": "workspace:*",
-    "@strudel.cycles/transpiler": "workspace:*",
-    "@strudel.cycles/webaudio": "workspace:*",
-    "@strudel.cycles/xen": "workspace:*"
+    "@strudel/core": "workspace:*",
+    "@strudel/mini": "workspace:*",
+    "@strudel/tonal": "workspace:*",
+    "@strudel/transpiler": "workspace:*",
+    "@strudel/webaudio": "workspace:*",
+    "@strudel/xen": "workspace:*"
   },
   "devDependencies": {
-    "dependency-tree": "^10.0.9",
     "@tauri-apps/cli": "^1.5.9",
     "@vitest/ui": "^1.1.0",
-    "canvas": "^2.11.2",
+    "acorn": "^8.11.3",
+    "dependency-tree": "^10.0.9",
     "eslint": "^8.56.0",
     "eslint-plugin-import": "^2.29.1",
     "events": "^3.3.0",

packages/README.md

@@ -1,5 +1,5 @@
 # Packages
 
-Each folder represents one of the @strudel.cycles/* packages [published to npm](https://www.npmjs.com/org/strudel.cycles).
+Each folder represents one of the @strudel/* packages [published to npm](https://www.npmjs.com/org/strudel).
 
 To understand how those pieces connect, refer to the [Technical Manual](https://github.com/tidalcycles/strudel/wiki/Technical-Manual) or the individual READMEs.

packages/codemirror/autocomplete.mjs

@@ -3,6 +3,12 @@ import jsdoc from '../../doc.json';
 import { autocompletion } from '@codemirror/autocomplete';
 import { h } from './html';
 
+function plaintext(str) {
+  const div = document.createElement('div');
+  div.innerText = str;
+  return div.innerHTML;
+}
+
 const getDocLabel = (doc) => doc.name || doc.longname;
 const getInnerText = (html) => {
   var div = document.createElement('div');
@@ -21,7 +27,7 @@ ${doc.description}
   )}
 </ul>
 <div>
-  ${doc.examples?.map((example) => `<div><pre>${example}</pre></div>`)}
+  ${doc.examples?.map((example) => `<div><pre>${plaintext(example)}</pre></div>`)}
 </div>
 </div>`[0];
   /*

packages/codemirror/backlayer.mjs

@@ -1,38 +0,0 @@
-// import { SelectionRange } from '@codemirror/state';
-import { RectangleMarker } from '@codemirror/view';
-import { layer } from '@codemirror/view';
-
-// currently stuck with: https://discuss.codemirror.net/t/line-background-layer/7666
-
-export const backlayer = layer({
-  update: (update) => {
-    return update.docChanged;
-  },
-  markers: (view) => {
-    const offsetTop = 14; // how to know this number ? .view.documentTop is scroll relative..
-    const offsetLeft = 4; // how to know this number ?
-
-    return view.viewportLineBlocks.map((block) => {
-      const { left } = view.coordsAtPos(block.to);
-      return new RectangleMarker('cm-backlayer', offsetLeft, block.top + offsetTop, left, block.height);
-    });
-  },
-});
-
-/* const len = view.state.doc.length;
-const markers = RectangleMarker.forRange(
-  view,
-  'cm-backlayer',
-  SelectionRange.fromJSON({
-    from: 0,
-    to: len,
-    anchor: 0,
-    head: len,
-    empty: true,
-    assoc: -1,
-    bidiLevel: null,
-  }),
-);
-console.log('markser', markers);
-return markers;
- */

packages/codemirror/codemirror.mjs

@@ -2,7 +2,7 @@ import { closeBrackets } from '@codemirror/autocomplete';
 // import { search, highlightSelectionMatches } from '@codemirror/search';
 import { history } from '@codemirror/commands';
 import { javascript } from '@codemirror/lang-javascript';
-import { defaultHighlightStyle, syntaxHighlighting } from '@codemirror/language';
+import { defaultHighlightStyle, syntaxHighlighting, bracketMatching } from '@codemirror/language';
 import { Compartment, EditorState, Prec } from '@codemirror/state';
 import {
   EditorView,
@@ -12,19 +12,22 @@ import {
   lineNumbers,
   drawSelection,
 } from '@codemirror/view';
-import { Pattern, Drawer, repl, cleanupDraw } from '@strudel.cycles/core';
+import { Pattern, repl } from '@strudel/core';
+import { Drawer, cleanupDraw } from '@strudel/draw';
 import { isAutoCompletionEnabled } from './autocomplete.mjs';
 import { isTooltipEnabled } from './tooltip.mjs';
 import { flash, isFlashEnabled } from './flash.mjs';
 import { highlightMiniLocations, isPatternHighlightingEnabled, updateMiniLocations } from './highlight.mjs';
 import { keybindings } from './keybindings.mjs';
 import { initTheme, activateTheme, theme } from './themes.mjs';
-import { updateWidgets, sliderPlugin } from './slider.mjs';
+import { sliderPlugin, updateSliderWidgets } from './slider.mjs';
+import { widgetPlugin, updateWidgets } from './widget.mjs';
 import { persistentAtom } from '@nanostores/persistent';
-import { backlayer } from './backlayer.mjs';
 
 const extensions = {
   isLineWrappingEnabled: (on) => (on ? EditorView.lineWrapping : []),
+  isBracketMatchingEnabled: (on) => (on ? bracketMatching({ brackets: '()[]{}<>' }) : []),
+  isBracketClosingEnabled: (on) => (on ? closeBrackets() : []),
   isLineNumbersDisplayed: (on) => (on ? lineNumbers() : []),
   theme,
   isAutoCompletionEnabled,
@@ -38,6 +41,8 @@ const compartments = Object.fromEntries(Object.keys(extensions).map((key) => [ke
 
 export const defaultSettings = {
   keybindings: 'codemirror',
+  isBracketMatchingEnabled: false,
+  isBracketClosingEnabled: true,
   isLineNumbersDisplayed: true,
   isActiveLineHighlighted: false,
   isAutoCompletionEnabled: false,
@@ -70,14 +75,13 @@ export function initEditor({ initialCode = '', onChange, onEvaluate, onStop, roo
       ...initialSettings,
       javascript(),
       sliderPlugin,
+      widgetPlugin,
       // indentOnInput(), // works without. already brought with javascript extension?
       // bracketMatching(), // does not do anything
-      closeBrackets(),
       syntaxHighlighting(defaultHighlightStyle),
       history(),
       EditorView.updateListener.of((v) => onChange(v)),
       drawSelection({ cursorBlinkRate: 0 }),
-      backlayer,
       Prec.highest(
         keymap.of([
           {
@@ -125,6 +129,7 @@ export class StrudelMirror {
       id,
       initialCode = '',
       onDraw,
+      drawContext,
       drawTime = [0, 0],
       autodraw,
       prebake,
@@ -137,23 +142,16 @@ export class StrudelMirror {
     this.widgets = [];
     this.painters = [];
     this.drawTime = drawTime;
-    this.onDraw = onDraw;
-    const self = this;
+    this.drawContext = drawContext;
+    this.onDraw = onDraw || this.draw;
     this.id = id || s4();
 
     this.drawer = new Drawer((haps, time) => {
-      const currentFrame = haps.filter((hap) => time >= hap.whole.begin && time <= hap.endClipped);
+      const currentFrame = haps.filter((hap) => hap.isActive(time));
       this.highlight(currentFrame, time);
-      this.onDraw?.(haps, time, currentFrame, this.painters);
+      this.onDraw(haps, time, this.painters);
     }, drawTime);
 
-    // this approach does not work with multiple repls on screen
-    // TODO: refactor onPaint usages + find fix, maybe remove painters here?
-    Pattern.prototype.onPaint = function (onPaint) {
-      self.painters.push(onPaint);
-      return this;
-    };
-
     this.prebaked = prebake();
     autodraw && this.drawFirstFrame();
 
@@ -179,6 +177,14 @@ export class StrudelMirror {
       beforeEval: async () => {
         cleanupDraw();
         this.painters = [];
+        const self = this;
+        // this is similar to repl.mjs > injectPatternMethods
+        // maybe there is a solution without prototype hacking, but hey, it works
+        // we need to do this befor every eval to make sure it works with multiple StrudelMirror's side by side
+        Pattern.prototype.onPaint = function (onPaint) {
+          self.painters.push(onPaint);
+          return this;
+        };
         await this.prebaked;
         await replOptions?.beforeEval?.();
       },
@@ -186,7 +192,10 @@ export class StrudelMirror {
         // remember for when highlighting is toggled on
         this.miniLocations = options.meta?.miniLocations;
         this.widgets = options.meta?.widgets;
-        updateWidgets(this.editor, this.widgets);
+        const sliders = this.widgets.filter((w) => w.type === 'slider');
+        updateSliderWidgets(this.editor, sliders);
+        const widgets = this.widgets.filter((w) => w.type !== 'slider');
+        updateWidgets(this.editor, widgets);
         updateMiniLocations(this.editor, this.miniLocations);
         replOptions?.afterEval?.(options);
         this.adjustDrawTime();
@@ -230,6 +239,9 @@ export class StrudelMirror {
     // when no painters are set, [0,0] is enough (just highlighting)
     this.drawer.setDrawTime(this.painters.length ? this.drawTime : [0, 0]);
   }
+  draw(haps, time) {
+    this.painters?.forEach((painter) => painter(this.drawContext, time, haps, this.drawTime));
+  }
   async drawFirstFrame() {
     if (!this.onDraw) {
       return;
@@ -240,7 +252,7 @@ export class StrudelMirror {
       await this.repl.evaluate(this.code, false);
       this.drawer.invalidate(this.repl.scheduler, -0.001);
       // draw at -0.001 to avoid haps at 0 to be visualized as active
-      this.onDraw?.(this.drawer.visibleHaps, -0.001, [], this.painters);
+      this.onDraw?.(this.drawer.visibleHaps, -0.001, this.painters);
     } catch (err) {
       console.warn('first frame could not be painted');
     }
@@ -292,9 +304,15 @@ export class StrudelMirror {
   setLineWrappingEnabled(enabled) {
     this.reconfigureExtension('isLineWrappingEnabled', enabled);
   }
+  setBracketMatchingEnabled(enabled) {
+    this.reconfigureExtension('isBracketMatchingEnabled', enabled);
+  }
   setLineNumbersDisplayed(enabled) {
     this.reconfigureExtension('isLineNumbersDisplayed', enabled);
   }
+  setBracketClosingEnabled(enabled) {
+    this.reconfigureExtension('isBracketClosingEnabled', enabled);
+  }
   setTheme(theme) {
     this.reconfigureExtension('theme', theme);
   }
@@ -327,6 +345,17 @@ export class StrudelMirror {
   clear() {
     this.onStartRepl && document.removeEventListener('start-repl', this.onStartRepl);
   }
+  getCursorLocation() {
+    return this.editor.state.selection.main.head;
+  }
+  setCursorLocation(col) {
+    return this.editor.dispatch({ selection: { anchor: col } });
+  }
+  appendCode(code) {
+    const cursor = this.getCursorLocation();
+    this.setCode(this.code + code);
+    this.setCursorLocation(cursor);
+  }
 }
 
 function parseBooleans(value) {

packages/codemirror/highlight.mjs

@@ -57,6 +57,9 @@ const visibleMiniLocations = StateField.define({
         // this is why we need to find a way to update the existing decorations, showing the ones that have an active range
         const haps = new Map();
         for (let hap of e.value.haps) {
+          if (!hap.context?.locations || !hap.whole) {
+            continue;
+          }
           for (let { start, end } of hap.context.locations) {
             let id = `${start}:${end}`;
             if (!haps.has(id) || haps.get(id).whole.begin.lt(hap.whole.begin)) {
@@ -64,7 +67,6 @@ const visibleMiniLocations = StateField.define({
             }
           }
         }
-
         visible = { atTime: e.value.atTime, haps };
       }
     }
@@ -90,7 +92,7 @@ const miniLocationHighlights = EditorView.decorations.compute([miniLocations, vi
 
     if (haps.has(id)) {
       const hap = haps.get(id);
-      const color = hap.context.color ?? 'var(--foreground)';
+      const color = hap.value?.color ?? 'var(--foreground)';
       // Get explicit channels for color values
       /* 
       const swatch = document.createElement('div');

packages/codemirror/index.mjs

@@ -3,4 +3,4 @@ export * from './highlight.mjs';
 export * from './flash.mjs';
 export * from './slider.mjs';
 export * from './themes.mjs';
-export * from './backlayer.mjs';
+export * from './widget.mjs';

packages/codemirror/package.json

@@ -1,11 +1,10 @@
 {
   "name": "@strudel/codemirror",
-  "version": "0.9.0",
+  "version": "1.1.0",
   "description": "Codemirror Extensions for Strudel",
   "main": "index.mjs",
   "publishConfig": {
-    "main": "dist/index.js",
-    "module": "dist/index.mjs"
+    "main": "dist/index.mjs"
   },
   "scripts": {
     "build": "vite build",
@@ -41,14 +40,16 @@
     "@codemirror/state": "^6.4.0",
     "@codemirror/view": "^6.23.0",
     "@lezer/highlight": "^1.2.0",
+    "@nanostores/persistent": "^0.9.1",
     "@replit/codemirror-emacs": "^6.0.1",
     "@replit/codemirror-vim": "^6.1.0",
     "@replit/codemirror-vscode-keymap": "^6.0.2",
-    "@strudel.cycles/core": "workspace:*",
+    "@strudel/core": "workspace:*",
+    "@strudel/draw": "workspace:*",
+    "@strudel/transpiler": "workspace:*",
     "@uiw/codemirror-themes": "^4.21.21",
     "@uiw/codemirror-themes-all": "^4.21.21",
-    "nanostores": "^0.9.5",
-    "@nanostores/persistent": "^0.9.1"
+    "nanostores": "^0.9.5"
   },
   "devDependencies": {
     "vite": "^5.0.10"

packages/codemirror/slider.mjs

@@ -1,6 +1,6 @@
-import { ref, pure } from '@strudel.cycles/core';
+import { ref, pure } from '@strudel/core';
 import { WidgetType, ViewPlugin, Decoration } from '@codemirror/view';
-import { StateEffect, StateField } from '@codemirror/state';
+import { StateEffect } from '@codemirror/state';
 
 export let sliderValues = {};
 const getSliderID = (from) => `slider_${from}`;
@@ -60,19 +60,21 @@ export class SliderWidget extends WidgetType {
   }
 }
 
-export const setWidgets = StateEffect.define();
+export const setSliderWidgets = StateEffect.define();
 
-export const updateWidgets = (view, widgets) => {
-  view.dispatch({ effects: setWidgets.of(widgets) });
+export const updateSliderWidgets = (view, widgets) => {
+  view.dispatch({ effects: setSliderWidgets.of(widgets) });
 };
 
-function getWidgets(widgetConfigs, view) {
-  return widgetConfigs.map(({ from, to, value, min, max, step }) => {
-    return Decoration.widget({
-      widget: new SliderWidget(value, min, max, from, to, step, view),
-      side: 0,
-    }).range(from /* , to */);
-  });
+function getSliders(widgetConfigs, view) {
+  return widgetConfigs
+    .filter((w) => w.type === 'slider')
+    .map(({ from, to, value, min, max, step }) => {
+      return Decoration.widget({
+        widget: new SliderWidget(value, min, max, from, to, step, view),
+        side: 0,
+      }).range(from /* , to */);
+    });
 }
 
 export const sliderPlugin = ViewPlugin.fromClass(
@@ -99,8 +101,8 @@ export const sliderPlugin = ViewPlugin.fromClass(
           }
         }
         for (let e of tr.effects) {
-          if (e.is(setWidgets)) {
-            this.decorations = Decoration.set(getWidgets(e.value, update.view));
+          if (e.is(setSliderWidgets)) {
+            this.decorations = Decoration.set(getSliders(e.value, update.view));
           }
         }
       });

packages/codemirror/themes.mjs

@@ -37,6 +37,7 @@ import whitescreen, { settings as whitescreenSettings } from './themes/whitescre
 import teletext, { settings as teletextSettings } from './themes/teletext';
 import algoboy, { settings as algoboySettings } from './themes/algoboy';
 import terminal, { settings as terminalSettings } from './themes/terminal';
+import { setTheme } from '@strudel/draw';
 
 export const themes = {
   strudelTheme,
@@ -513,6 +514,7 @@ export function activateTheme(name) {
         .map(([key, value]) => `--${key}: ${value} !important;`)
         .join('\n')}
     }`;
+  setTheme(themeSettings);
   // tailwind dark mode
   if (themeSettings.light) {
     document.documentElement.classList.remove('dark');

packages/codemirror/themes/algoboy.mjs

@@ -18,6 +18,7 @@ export default createTheme({
   theme: 'light',
   settings,
   styles: [
+    { tag: t.labelName, color: '#0f380f' },
     { tag: t.keyword, color: '#0f380f' },
     { tag: t.operator, color: '#0f380f' },
     { tag: t.special(t.variableName), color: '#0f380f' },

packages/codemirror/themes/blackscreen.mjs

@@ -15,6 +15,7 @@ export default createTheme({
   theme: 'dark',
   settings,
   styles: [
+    { tag: t.labelName, color: 'white' },
     { tag: t.keyword, color: 'white' },
     { tag: t.operator, color: 'white' },
     { tag: t.special(t.variableName), color: 'white' },

packages/codemirror/themes/bluescreen.mjs

@@ -18,6 +18,7 @@ export default createTheme({
   theme: 'dark',
   settings,
   styles: [
+    { tag: t.labelName, color: 'white' },
     { tag: t.keyword, color: 'white' },
     { tag: t.operator, color: 'white' },
     { tag: t.special(t.variableName), color: 'white' },

packages/codemirror/themes/strudel-theme.mjs

@@ -15,6 +15,7 @@ export default createTheme({
     gutterForeground: '#8a919966',
   },
   styles: [
+    { tag: t.labelName, color: '#89ddff' },
     { tag: t.keyword, color: '#c792ea' },
     { tag: t.operator, color: '#89ddff' },
     { tag: t.special(t.variableName), color: '#eeffff' },

packages/codemirror/themes/teletext.mjs

@@ -27,6 +27,7 @@ export default createTheme({
   theme: 'dark',
   settings,
   styles: [
+    { tag: t.labelName, color: colorB },
     { tag: t.keyword, color: colorA },
     { tag: t.operator, color: mini },
     { tag: t.special(t.variableName), color: colorA },

packages/codemirror/themes/terminal.mjs

@@ -14,6 +14,7 @@ export default createTheme({
   theme: 'dark',
   settings,
   styles: [
+    { tag: t.labelName, color: '#41FF00' },
     { tag: t.keyword, color: '#41FF00' },
     { tag: t.operator, color: '#41FF00' },
     { tag: t.special(t.variableName), color: '#41FF00' },

packages/codemirror/themes/whitescreen.mjs

@@ -16,6 +16,7 @@ export default createTheme({
   theme: 'light',
   settings,
   styles: [
+    { tag: t.labelName, color: 'black' },
     { tag: t.keyword, color: 'black' },
     { tag: t.operator, color: 'black' },
     { tag: t.special(t.variableName), color: 'black' },

packages/codemirror/vite.config.js

@@ -8,8 +8,8 @@ export default defineConfig({
   build: {
     lib: {
       entry: resolve(__dirname, 'index.mjs'),
-      formats: ['es', 'cjs'],
-      fileName: (ext) => ({ es: 'index.mjs', cjs: 'index.js' })[ext],
+      formats: ['es'],
+      fileName: (ext) => ({ es: 'index.mjs' })[ext],
     },
     rollupOptions: {
       external: [...Object.keys(dependencies)],

packages/codemirror/widget.mjs

@@ -0,0 +1,135 @@
+import { StateEffect, StateField } from '@codemirror/state';
+import { Decoration, EditorView, WidgetType } from '@codemirror/view';
+import { getWidgetID, registerWidgetType } from '@strudel/transpiler';
+import { Pattern } from '@strudel/core';
+
+export const addWidget = StateEffect.define({
+  map: ({ from, to }, change) => {
+    return { from: change.mapPos(from), to: change.mapPos(to) };
+  },
+});
+
+export const updateWidgets = (view, widgets) => {
+  view.dispatch({ effects: addWidget.of(widgets) });
+};
+
+function getWidgets(widgetConfigs) {
+  return (
+    widgetConfigs
+      // codemirror throws an error if we don't sort
+      .sort((a, b) => a.to - b.to)
+      .map((widgetConfig) => {
+        return Decoration.widget({
+          widget: new BlockWidget(widgetConfig),
+          side: 0,
+          block: true,
+        }).range(widgetConfig.to);
+      })
+  );
+}
+
+const widgetField = StateField.define(
+  /* <DecorationSet> */ {
+    create() {
+      return Decoration.none;
+    },
+    update(widgets, tr) {
+      widgets = widgets.map(tr.changes);
+      for (let e of tr.effects) {
+        if (e.is(addWidget)) {
+          try {
+            widgets = widgets.update({
+              filter: () => false,
+              add: getWidgets(e.value),
+            });
+          } catch (error) {
+            console.log('err', error);
+          }
+        }
+      }
+      return widgets;
+    },
+    provide: (f) => EditorView.decorations.from(f),
+  },
+);
+
+const widgetElements = {};
+export function setWidget(id, el) {
+  widgetElements[id] = el;
+  el.id = id;
+}
+
+export class BlockWidget extends WidgetType {
+  constructor(widgetConfig) {
+    super();
+    this.widgetConfig = widgetConfig;
+  }
+  eq() {
+    return true;
+  }
+  toDOM() {
+    const id = getWidgetID(this.widgetConfig);
+    const el = widgetElements[id];
+    return el;
+  }
+  ignoreEvent(e) {
+    return true;
+  }
+}
+
+export const widgetPlugin = [widgetField];
+
+// widget implementer API to create a new widget type
+export function registerWidget(type, fn) {
+  registerWidgetType(type);
+  if (fn) {
+    Pattern.prototype[type] = function (id, options = { fold: 1 }) {
+      // fn is expected to create a dom element and call setWidget(id, el);
+      // fn should also return the pattern
+      return fn(id, options, this);
+    };
+  }
+}
+
+// wire up @strudel/draw functions
+
+function getCanvasWidget(id, options = {}) {
+  const { width = 500, height = 60, pixelRatio = window.devicePixelRatio } = options;
+  let canvas = document.getElementById(id) || document.createElement('canvas');
+  canvas.width = width * pixelRatio;
+  canvas.height = height * pixelRatio;
+  canvas.style.width = width + 'px';
+  canvas.style.height = height + 'px';
+  setWidget(id, canvas);
+  return canvas;
+}
+
+registerWidget('_pianoroll', (id, options = {}, pat) => {
+  const ctx = getCanvasWidget(id, options).getContext('2d');
+  return pat.tag(id).pianoroll({ fold: 1, ...options, ctx, id });
+});
+
+registerWidget('_punchcard', (id, options = {}, pat) => {
+  const ctx = getCanvasWidget(id, options).getContext('2d');
+  return pat.tag(id).punchcard({ fold: 1, ...options, ctx, id });
+});
+
+registerWidget('_spiral', (id, options = {}, pat) => {
+  let _size = options.size || 275;
+  options = { width: _size, height: _size, ...options, size: _size / 5 };
+  const ctx = getCanvasWidget(id, options).getContext('2d');
+  return pat.tag(id).spiral({ ...options, ctx, id });
+});
+
+registerWidget('_scope', (id, options = {}, pat) => {
+  options = { width: 500, height: 60, pos: 0.5, scale: 1, ...options };
+  const ctx = getCanvasWidget(id, options).getContext('2d');
+  return pat.tag(id).scope({ ...options, ctx, id });
+});
+
+registerWidget('_pitchwheel', (id, options = {}, pat) => {
+  let _size = options.size || 200;
+  options = { width: _size, height: _size, ...options, size: _size / 5 };
+  const ctx = getCanvasWidget(id, options).getContext('2d');
+  return pat.pitchwheel({ ...options, ctx, id });
+});

packages/core/README.md

@@ -1,17 +1,17 @@
-# @strudel.cycles/core
+# @strudel/core
 
 This package contains the bare essence of strudel.
 
 ## Install
 
 ```sh
-npm i @strudel.cycles/core --save
+npm i @strudel/core --save
 ```
 
 ## Example
 
 ```js
-import { sequence } from '@strudel.cycles/core';
+import { sequence } from '@strudel/core';
 
 const pattern = sequence('a', ['b', 'c']);
 
@@ -33,7 +33,7 @@ b: 3/2 - 7/4
 c: 7/4 - 2
 ```
 
-- [play with @strudel.cycles/core on codesandbox](https://codesandbox.io/s/strudel-core-test-forked-9ywhv7?file=/src/index.js).
+- [play with @strudel/core on codesandbox](https://codesandbox.io/s/strudel-core-test-forked-9ywhv7?file=/src/index.js).
 - [open color pattern example](https://raw.githack.com/tidalcycles/strudel/main/packages/core/examples/canvas.html)
 - [open minimal repl example](https://raw.githack.com/tidalcycles/strudel/main/packages/core/examples/vanilla.html)
 - [open minimal vite example](./examples/vite-vanilla-repl/)

packages/core/bench/pattern.bench.mjs

@@ -0,0 +1,46 @@
+import { describe, bench } from 'vitest';
+
+import { calculateTactus, sequence, stack } from '../index.mjs';
+
+const pat64 = sequence(...Array(64).keys());
+
+describe('tactus', () => {
+  calculateTactus(true);
+  bench(
+    '+tactus',
+    () => {
+      pat64.iter(64).fast(64).firstCycle();
+    },
+    { time: 1000 },
+  );
+
+  calculateTactus(false);
+  bench(
+    '-tactus',
+    () => {
+      pat64.iter(64).fast(64).firstCycle();
+    },
+    { time: 1000 },
+  );
+});
+
+describe('stack', () => {
+  calculateTactus(true);
+  bench(
+    '+tactus',
+    () => {
+      stack(pat64, pat64, pat64, pat64, pat64, pat64, pat64, pat64).fast(64).firstCycle();
+    },
+    { time: 1000 },
+  );
+
+  calculateTactus(false);
+  bench(
+    '-tactus',
+    () => {
+      stack(pat64, pat64, pat64, pat64, pat64, pat64, pat64, pat64).fast(64).firstCycle();
+    },
+    { time: 1000 },
+  );
+});
+calculateTactus(true);

packages/core/clockworker.js

@@ -0,0 +1,168 @@
+// eslint-disable-next-line no-undef
+// TODO: swap below line with above one when firefox supports esm imports in service workers
+// see https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorker?retiredLocale=de#browser_compatibility
+// import createClock from './zyklus.mjs';
+
+function getTime() {
+  const precision = 10 ** 4;
+  const seconds = performance.now() / 1000;
+  return Math.round(seconds * precision) / precision;
+}
+
+let num_cycles_at_cps_change = 0;
+let num_ticks_since_cps_change = 0;
+let num_seconds_at_cps_change = 0;
+let cps = 0.5;
+// {id: {started: boolean}}
+const clients = new Map();
+const duration = 0.1;
+const channel = new BroadcastChannel('strudeltick');
+
+const sendMessage = (type, payload) => {
+  channel.postMessage({ type, payload });
+};
+
+const sendTick = (phase, duration, tick, time) => {
+  const num_seconds_since_cps_change = num_ticks_since_cps_change * duration;
+
+  const tickdeadline = phase - time;
+  const lastTick = time + tickdeadline;
+  const num_cycles_since_cps_change = num_seconds_since_cps_change * cps;
+
+  const begin = num_cycles_at_cps_change + num_cycles_since_cps_change;
+  const secondsSinceLastTick = time - lastTick - duration;
+
+  const eventLength = duration * cps;
+  const end = begin + eventLength;
+
+  const cycle = begin + secondsSinceLastTick * cps;
+
+  sendMessage('tick', {
+    begin,
+    end,
+    cps,
+    tickdeadline,
+    num_cycles_at_cps_change,
+    num_seconds_at_cps_change,
+    num_seconds_since_cps_change,
+    cycle,
+  });
+  num_ticks_since_cps_change++;
+};
+
+//create clock method from zyklus
+const clock = createClock(getTime, sendTick, duration);
+let started = false;
+
+const startClock = (id) => {
+  clients.set(id, { started: true });
+  if (started) {
+    return;
+  }
+  clock.start();
+  started = true;
+};
+const stopClock = async (id) => {
+  clients.set(id, { started: false });
+
+  const otherClientStarted = Array.from(clients.values()).some((c) => c.started);
+  //dont stop the clock if other instances are running...
+  if (!started || otherClientStarted) {
+    return;
+  }
+
+  clock.stop();
+  setCycle(0);
+  started = false;
+};
+
+const setCycle = (cycle) => {
+  num_ticks_since_cps_change = 0;
+  num_cycles_at_cps_change = cycle;
+};
+
+const processMessage = (message) => {
+  const { type, payload } = message;
+
+  switch (type) {
+    case 'cpschange': {
+      if (payload.cps !== cps) {
+        const num_seconds_since_cps_change = num_ticks_since_cps_change * duration;
+        num_cycles_at_cps_change = num_cycles_at_cps_change + num_seconds_since_cps_change * cps;
+        num_seconds_at_cps_change = num_seconds_at_cps_change + num_seconds_since_cps_change;
+        cps = payload.cps;
+        num_ticks_since_cps_change = 0;
+      }
+      break;
+    }
+    case 'setcycle': {
+      setCycle(payload.cycle);
+      break;
+    }
+    case 'toggle': {
+      if (payload.started) {
+        startClock(message.id);
+      } else {
+        stopClock(message.id);
+      }
+      break;
+    }
+  }
+};
+
+self.onconnect = function (e) {
+  // the incoming port
+  const port = e.ports[0];
+
+  port.addEventListener('message', function (e) {
+    processMessage(e.data);
+  });
+  port.start(); // Required when using addEventListener. Otherwise called implicitly by onmessage setter.
+};
+
+// used to consistently schedule events, for use in a service worker - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/clockworker.mjs>
+function createClock(
+  getTime,
+  callback, // called slightly before each cycle
+  duration = 0.05, // duration of each cycle
+  interval = 0.1, // interval between callbacks
+  overlap = 0.1, // overlap between callbacks
+) {
+  let tick = 0; // counts callbacks
+  let phase = 0; // next callback time
+  let precision = 10 ** 4; // used to round phase
+  let minLatency = 0.01;
+  const setDuration = (setter) => (duration = setter(duration));
+  overlap = overlap || interval / 2;
+  const onTick = () => {
+    const t = getTime();
+    const lookahead = t + interval + overlap; // the time window for this tick
+    if (phase === 0) {
+      phase = t + minLatency;
+    }
+    // callback as long as we're inside the lookahead
+    while (phase < lookahead) {
+      phase = Math.round(phase * precision) / precision;
+      phase >= t && callback(phase, duration, tick, t);
+      phase < t && console.log('TOO LATE', phase); // what if latency is added from outside?
+      phase += duration; // increment phase by duration
+      tick++;
+    }
+  };
+  let intervalID;
+  const start = () => {
+    clear(); // just in case start was called more than once
+    onTick();
+    intervalID = setInterval(onTick, interval * 1000);
+  };
+  const clear = () => intervalID !== undefined && clearInterval(intervalID);
+  const pause = () => clear();
+  const stop = () => {
+    tick = 0;
+    phase = 0;
+    clear();
+  };
+  const getPhase = () => phase;
+  // setCallback
+  return { setDuration, start, stop, pause, duration, interval, getPhase, minLatency };
+}

packages/core/cyclist.mjs

@@ -1,5 +1,5 @@
 /*
-cyclist.mjs - <short description TODO>
+cyclist.mjs - event scheduler for a single strudel instance. for multi-instance scheduler, see - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/neocyclist.mjs>
 Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/cyclist.mjs>
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
@@ -8,49 +8,55 @@ import createClock from './zyklus.mjs';
 import { logger } from './logger.mjs';
 
 export class Cyclist {
-  constructor({ interval, onTrigger, onToggle, onError, getTime, latency = 0.1 }) {
+  constructor({ interval, onTrigger, onToggle, onError, getTime, latency = 0.1, setInterval, clearInterval }) {
     this.started = false;
-    this.cps = 1;
+    this.cps = 0.5;
     this.num_ticks_since_cps_change = 0;
     this.lastTick = 0; // absolute time when last tick (clock callback) happened
     this.lastBegin = 0; // query begin of last tick
     this.lastEnd = 0; // query end of last tick
     this.getTime = getTime; // get absolute time
-    this.num_cycles_since_last_cps_change = 0;
+    this.num_cycles_at_cps_change = 0;
+    this.seconds_at_cps_change; // clock phase when cps was changed
     this.onToggle = onToggle;
     this.latency = latency; // fixed trigger time offset
     this.clock = createClock(
       getTime,
       // called slightly before each cycle
-      (phase, duration, tick) => {
-        if (tick === 0) {
-          this.origin = phase;
-        }
+      (phase, duration, _, t) => {
         if (this.num_ticks_since_cps_change === 0) {
-          this.num_cycles_since_last_cps_change = this.lastEnd;
+          this.num_cycles_at_cps_change = this.lastEnd;
+          this.seconds_at_cps_change = phase;
         }
         this.num_ticks_since_cps_change++;
+        const seconds_since_cps_change = this.num_ticks_since_cps_change * duration;
+        const num_cycles_since_cps_change = seconds_since_cps_change * this.cps;
+
         try {
-          const time = getTime();
           const begin = this.lastEnd;
           this.lastBegin = begin;
-
-          //convert ticks to cycles, so you can query the pattern for events
-          const eventLength = duration * this.cps;
-          const end = this.num_cycles_since_last_cps_change + this.num_ticks_since_cps_change * eventLength;
+          const end = this.num_cycles_at_cps_change + num_cycles_since_cps_change;
           this.lastEnd = end;
+          this.lastTick = phase;
+
+          if (phase < t) {
+            // avoid querying haps that are in the past anyway
+            console.log(`skip query: too late`);
+            return;
+          }
 
           // query the pattern for events
-          const haps = this.pattern.queryArc(begin, end);
-
-          const tickdeadline = phase - time; // time left until the phase is a whole number
-          this.lastTick = time + tickdeadline;
+          const haps = this.pattern.queryArc(begin, end, { _cps: this.cps });
 
           haps.forEach((hap) => {
-            if (hap.part.begin.equals(hap.whole.begin)) {
-              const deadline = (hap.whole.begin - begin) / this.cps + tickdeadline + latency;
+            if (hap.hasOnset()) {
+              const targetTime =
+                (hap.whole.begin - this.num_cycles_at_cps_change) / this.cps + this.seconds_at_cps_change + latency;
               const duration = hap.duration / this.cps;
-              onTrigger?.(hap, deadline, duration, this.cps);
+              // the following line is dumb and only here for backwards compatibility
+              // see https://github.com/tidalcycles/strudel/pull/1004
+              const deadline = targetTime - phase;
+              onTrigger?.(hap, deadline, duration, this.cps, targetTime);
             }
           });
         } catch (e) {
@@ -59,9 +65,16 @@ export class Cyclist {
         }
       },
       interval, // duration of each cycle
+      0.1,
+      0.1,
+      setInterval,
+      clearInterval,
     );
   }
   now() {
+    if (!this.started) {
+      return 0;
+    }
     const secondsSinceLastTick = this.getTime() - this.lastTick - this.clock.duration;
     return this.lastBegin + secondsSinceLastTick * this.cps; // + this.clock.minLatency;
   }
@@ -71,7 +84,7 @@ export class Cyclist {
   }
   start() {
     this.num_ticks_since_cps_change = 0;
-    this.num_cycles_since_last_cps_change = 0;
+    this.num_cycles_at_cps_change = 0;
     if (!this.pattern) {
       throw new Error('Scheduler: no pattern set! call .setPattern first.');
     }
@@ -96,7 +109,7 @@ export class Cyclist {
       this.start();
     }
   }
-  setCps(cps = 1) {
+  setCps(cps = 0.5) {
     if (this.cps === cps) {
       return;
     }

packages/core/euclid.mjs

@@ -41,11 +41,17 @@ const _bjork = function (n, x) {
 };
 
 export const bjork = function (ons, steps) {
+  const inverted = ons < 0;
+  ons = Math.abs(ons);
   const offs = steps - ons;
   const x = Array(ons).fill([1]);
   const y = Array(offs).fill([0]);
   const result = _bjork([ons, offs], [x, y]);
-  return flatten(result[1][0]).concat(flatten(result[1][1]));
+  const p = flatten(result[1][0]).concat(flatten(result[1][1]));
+  if (inverted) {
+    return p.map((x) => (x === 0 ? 1 : 0));
+  }
+  return p;
 };
 
 /**
@@ -148,7 +154,7 @@ export const { euclidrot, euclidRot } = register(['euclidrot', 'euclidRot'], fun
  * @param {number} pulses the number of onsets / beats
  * @param {number} steps the number of steps to fill
  * @example
- * n("g2").decay(.1).sustain(.3).euclidLegato(3,8)
+ * note("c3").euclidLegato(3,8)
  */
 
 const _euclidLegato = function (pulses, steps, rotation, pat) {

packages/core/evaluate.mjs

@@ -22,6 +22,7 @@ export const evalScope = async (...args) => {
       globalThis[name] = value;
     });
   });
+  return modules;
 };
 
 function safeEval(str, options = {}) {

packages/core/fraction.mjs

@@ -6,6 +6,7 @@ This program is free software: you can redistribute it and/or modify it under th
 
 import Fraction from 'fraction.js';
 import { TimeSpan } from './timespan.mjs';
+import { removeUndefineds } from './util.mjs';
 
 // Returns the start of the cycle.
 Fraction.prototype.sam = function () {
@@ -47,14 +48,39 @@ Fraction.prototype.eq = function (other) {
   return this.compare(other) == 0;
 };
 
+Fraction.prototype.ne = function (other) {
+  return this.compare(other) != 0;
+};
+
 Fraction.prototype.max = function (other) {
   return this.gt(other) ? this : other;
 };
 
+Fraction.prototype.maximum = function (...others) {
+  others = others.map((x) => new Fraction(x));
+  return others.reduce((max, other) => other.max(max), this);
+};
+
 Fraction.prototype.min = function (other) {
   return this.lt(other) ? this : other;
 };
 
+Fraction.prototype.mulmaybe = function (other) {
+  return other !== undefined ? this.mul(other) : undefined;
+};
+
+Fraction.prototype.divmaybe = function (other) {
+  return other !== undefined ? this.div(other) : undefined;
+};
+
+Fraction.prototype.addmaybe = function (other) {
+  return other !== undefined ? this.add(other) : undefined;
+};
+
+Fraction.prototype.submaybe = function (other) {
+  return other !== undefined ? this.sub(other) : undefined;
+};
+
 Fraction.prototype.show = function (/* excludeWhole = false */) {
   // return this.toFraction(excludeWhole);
   return this.s * this.n + '/' + this.d;
@@ -80,9 +106,26 @@ const fraction = (n) => {
 };
 
 export const gcd = (...fractions) => {
+  fractions = removeUndefineds(fractions);
+  if (fractions.length === 0) {
+    return undefined;
+  }
+
   return fractions.reduce((gcd, fraction) => gcd.gcd(fraction), fraction(1));
 };
 
+export const lcm = (...fractions) => {
+  fractions = removeUndefineds(fractions);
+  if (fractions.length === 0) {
+    return undefined;
+  }
+
+  return fractions.reduce(
+    (lcm, fraction) => (lcm === undefined || fraction === undefined ? undefined : lcm.lcm(fraction)),
+    fraction(1),
+  );
+};
+
 fraction._original = Fraction;
 
 export default fraction;

packages/core/hap.mjs

@@ -3,6 +3,7 @@ hap.mjs - <short description TODO>
 Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/hap.mjs>
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
+import Fraction from './fraction.mjs';
 
 export class Hap {
   /*
@@ -32,13 +33,43 @@ export class Hap {
   }
 
   get duration() {
-    return this.whole.end.sub(this.whole.begin).mul(typeof this.value?.clip === 'number' ? this.value?.clip : 1);
+    let duration;
+    if (typeof this.value?.duration === 'number') {
+      duration = Fraction(this.value.duration);
+    } else {
+      duration = this.whole.end.sub(this.whole.begin);
+    }
+    if (typeof this.value?.clip === 'number') {
+      return duration.mul(this.value.clip);
+    }
+    return duration;
   }
 
   get endClipped() {
     return this.whole.begin.add(this.duration);
   }
 
+  isActive(currentTime) {
+    return this.whole.begin <= currentTime && this.endClipped >= currentTime;
+  }
+
+  isInPast(currentTime) {
+    return currentTime > this.endClipped;
+  }
+  isInNearPast(margin, currentTime) {
+    return currentTime - margin <= this.endClipped;
+  }
+
+  isInFuture(currentTime) {
+    return currentTime < this.whole.begin;
+  }
+  isInNearFuture(margin, currentTime) {
+    return currentTime < this.whole.begin && currentTime > this.whole.begin - margin;
+  }
+  isWithinTime(min, max) {
+    return this.whole.begin <= max && this.endClipped >= min;
+  }
+
   wholeOrPart() {
     return this.whole ? this.whole : this.part;
   }
@@ -60,6 +91,10 @@ export class Hap {
     return this.whole != undefined && this.whole.begin.equals(this.part.begin);
   }
 
+  hasTag(tag) {
+    return this.context.tags?.includes(tag);
+  }
+
   resolveState(state) {
     if (this.stateful && this.hasOnset()) {
       console.log('stateful');

packages/core/index.mjs

@@ -4,11 +4,13 @@ Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/st
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import controls from './controls.mjs';
+import * as controls from './controls.mjs'; // legacy
 export * from './euclid.mjs';
 import Fraction from './fraction.mjs';
+import createClock from './zyklus.mjs';
 import { logger } from './logger.mjs';
-export { Fraction, controls };
+export { Fraction, controls, createClock };
+export * from './controls.mjs';
 export * from './hap.mjs';
 export * from './pattern.mjs';
 export * from './signal.mjs';
@@ -21,21 +23,17 @@ export * from './repl.mjs';
 export * from './cyclist.mjs';
 export * from './logger.mjs';
 export * from './time.mjs';
-export * from './draw.mjs';
-export * from './animate.mjs';
-export * from './pianoroll.mjs';
-export * from './spiral.mjs';
 export * from './ui.mjs';
 export { default as drawLine } from './drawLine.mjs';
 // below won't work with runtime.mjs (json import fails)
 /* import * as p from './package.json';
 export const version = p.version; */
-logger('🌀 @strudel.cycles/core loaded 🌀');
+logger('🌀 @strudel/core loaded 🌀');
 if (globalThis._strudelLoaded) {
   console.warn(
-    `@strudel.cycles/core was loaded more than once...
+    `@strudel/core was loaded more than once...
 This might happen when you have multiple versions of strudel installed. 
-Please check with "npm ls @strudel.cycles/core".`,
+Please check with "npm ls @strudel/core".`,
   );
 }
 globalThis._strudelLoaded = true;

packages/core/logger.mjs

@@ -1,6 +1,16 @@
 export const logKey = 'strudel.log';
 
+let debounce = 1000,
+  lastMessage,
+  lastTime;
+
 export function logger(message, type, data = {}) {
+  let t = performance.now();
+  if (lastMessage === message && t - lastTime < debounce) {
+    return;
+  }
+  lastMessage = message;
+  lastTime = t;
   console.log(`%c${message}`, 'background-color: black;color:white;border-radius:15px');
   if (typeof document !== 'undefined' && typeof CustomEvent !== 'undefined') {
     document.dispatchEvent(

packages/core/neocyclist.mjs

@@ -0,0 +1,147 @@
+/*
+neocyclist.mjs - event scheduler like cyclist, except recieves clock pulses from clockworker in order to sync across multiple instances.
+Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/neocyclist.mjs>
+This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
+*/
+
+import { logger } from './logger.mjs';
+
+export class NeoCyclist {
+  constructor({ onTrigger, onToggle, getTime }) {
+    this.started = false;
+    this.cps = 0.5;
+    this.lastTick = 0; // absolute time when last tick (clock callback) happened
+    this.getTime = getTime; // get absolute time
+    this.time_at_last_tick_message = 0;
+
+    this.num_cycles_at_cps_change = 0;
+    this.onToggle = onToggle;
+    this.latency = 0.1; // fixed trigger time offset
+    this.cycle = 0;
+    this.id = Math.round(Date.now() * Math.random());
+    this.worker_time_dif;
+    this.worker = new SharedWorker(new URL('./clockworker.js', import.meta.url));
+    this.worker.port.start();
+
+    this.channel = new BroadcastChannel('strudeltick');
+    let weight = 0; // the amount of weight that is applied to the current average when averaging a new time dif
+    const maxWeight = 20;
+    const precision = 10 ** 3; //round off time diff to prevent accumulating outliers
+
+    // the clock of the worker and the audio context clock can drift apart over time
+    // aditionally, the message time of the worker pinging the callback to process haps can be inconsistent.
+    // we need to keep a rolling weighted average of the time difference between the worker clock and audio context clock
+    // in order to schedule events consistently.
+    const setTimeReference = (num_seconds_at_cps_change, num_seconds_since_cps_change, tickdeadline) => {
+      const time_dif = getTime() - (num_seconds_at_cps_change + num_seconds_since_cps_change) + tickdeadline;
+      if (this.worker_time_dif == null) {
+        this.worker_time_dif = time_dif;
+      } else {
+        const w = 1; //weight of new time diff;
+        const new_dif =
+          Math.round(((this.worker_time_dif * weight + time_dif * w) / (weight + w)) * precision) / precision;
+
+        if (new_dif != this.worker_time_dif) {
+          // reset the weight so the clock recovers faster from an audio context freeze/dropout if it happens
+          weight = 4;
+        }
+        this.worker_time_dif = new_dif;
+      }
+      weight = Math.min(weight + 1, maxWeight);
+    };
+
+    const tickCallback = (payload) => {
+      const {
+        num_cycles_at_cps_change,
+        cps,
+        num_seconds_at_cps_change,
+        num_seconds_since_cps_change,
+        begin,
+        end,
+        tickdeadline,
+        cycle,
+      } = payload;
+      this.cps = cps;
+      this.cycle = cycle;
+
+      setTimeReference(num_seconds_at_cps_change, num_seconds_since_cps_change, tickdeadline);
+
+      processHaps(begin, end, num_cycles_at_cps_change, num_seconds_at_cps_change);
+
+      this.time_at_last_tick_message = this.getTime();
+    };
+
+    const processHaps = (begin, end, num_cycles_at_cps_change, seconds_at_cps_change) => {
+      if (this.started === false) {
+        return;
+      }
+
+      const haps = this.pattern.queryArc(begin, end, { _cps: this.cps });
+
+      haps.forEach((hap) => {
+        if (hap.hasOnset()) {
+          const targetTime =
+            (hap.whole.begin - num_cycles_at_cps_change) / this.cps +
+            seconds_at_cps_change +
+            this.latency +
+            this.worker_time_dif;
+          const duration = hap.duration / this.cps;
+          onTrigger?.(hap, 0, duration, this.cps, targetTime);
+        }
+      });
+    };
+
+    // receive messages from worker clock and process them
+    this.channel.onmessage = (message) => {
+      if (!this.started) {
+        return;
+      }
+      const { payload, type } = message.data;
+
+      switch (type) {
+        case 'tick': {
+          tickCallback(payload);
+        }
+      }
+    };
+  }
+  sendMessage(type, payload) {
+    this.worker.port.postMessage({ type, payload, id: this.id });
+  }
+
+  now() {
+    const gap = (this.getTime() - this.time_at_last_tick_message) * this.cps;
+    return this.cycle + gap;
+  }
+  setCps(cps = 1) {
+    this.sendMessage('cpschange', { cps });
+  }
+  setCycle(cycle) {
+    this.sendMessage('setcycle', { cycle });
+  }
+  setStarted(started) {
+    this.sendMessage('toggle', { started });
+    this.started = started;
+    this.onToggle?.(started);
+  }
+  start() {
+    logger('[cyclist] start');
+    this.setStarted(true);
+  }
+  stop() {
+    this.worker_time_dif = null;
+    logger('[cyclist] stop');
+    this.setStarted(false);
+  }
+  setPattern(pat, autostart = false) {
+    this.pattern = pat;
+    if (autostart && !this.started) {
+      this.start();
+    }
+  }
+
+  log(begin, end, haps) {
+    const onsets = haps.filter((h) => h.hasOnset());
+    console.log(`${begin.toFixed(4)} - ${end.toFixed(4)} ${Array(onsets.length).fill('I').join('')}`);
+  }
+}

packages/core/package.json

@@ -1,15 +1,15 @@
 {
-  "name": "@strudel.cycles/core",
-  "version": "0.9.0",
+  "name": "@strudel/core",
+  "version": "1.1.0",
   "description": "Port of Tidal Cycles to JavaScript",
   "main": "index.mjs",
   "type": "module",
   "publishConfig": {
-    "main": "dist/index.js",
-    "module": "dist/index.mjs"
+    "main": "dist/index.mjs"
   },
   "scripts": {
     "test": "vitest run",
+    "bench": "vitest bench",
     "build": "vite build",
     "prepublishOnly": "pnpm build"
   },

packages/core/repl.mjs

@@ -1,3 +1,4 @@
+import { NeoCyclist } from './neocyclist.mjs';
 import { Cyclist } from './cyclist.mjs';
 import { evaluate as _evaluate } from './evaluate.mjs';
 import { logger } from './logger.mjs';
@@ -6,9 +7,7 @@ import { evalScope } from './evaluate.mjs';
 import { register, Pattern, isPattern, silence, stack } from './pattern.mjs';
 
 export function repl({
-  interval,
   defaultOutput,
-  onSchedulerError,
   onEvalError,
   beforeEval,
   afterEval,
@@ -17,6 +16,9 @@ export function repl({
   onToggle,
   editPattern,
   onUpdateState,
+  sync = false,
+  setInterval,
+  clearInterval,
 }) {
   const state = {
     schedulerError: undefined,
@@ -37,21 +39,27 @@ export function repl({
     onUpdateState?.(state);
   };
 
-  const scheduler = new Cyclist({
-    interval,
+  const schedulerOptions = {
     onTrigger: getTrigger({ defaultOutput, getTime }),
-    onError: onSchedulerError,
     getTime,
     onToggle: (started) => {
       updateState({ started });
       onToggle?.(started);
     },
-  });
+    setInterval,
+    clearInterval,
+  };
+
+  // NeoCyclist uses a shared worker to communicate between instances, which is not supported on mobile chrome
+  const scheduler =
+    sync && typeof SharedWorker != 'undefined' ? new NeoCyclist(schedulerOptions) : new Cyclist(schedulerOptions);
   let pPatterns = {};
+  let anonymousIndex = 0;
   let allTransform;
 
   const hush = function () {
     pPatterns = {};
+    anonymousIndex = 0;
     allTransform = undefined;
     return silence;
   };
@@ -61,12 +69,76 @@ export function repl({
     scheduler.setPattern(pattern, autostart);
   };
   setTime(() => scheduler.now()); // TODO: refactor?
+
+  const stop = () => scheduler.stop();
+  const start = () => scheduler.start();
+  const pause = () => scheduler.pause();
+  const toggle = () => scheduler.toggle();
+  const setCps = (cps) => scheduler.setCps(cps);
+  const setCpm = (cpm) => scheduler.setCps(cpm / 60);
+  const all = function (transform) {
+    allTransform = transform;
+    return silence;
+  };
+
+  // set pattern methods that use this repl via closure
+  const injectPatternMethods = () => {
+    Pattern.prototype.p = function (id) {
+      if (id.startsWith('_') || id.endsWith('_')) {
+        // allows muting a pattern x with x_ or _x
+        return silence;
+      }
+      if (id === '$') {
+        // allows adding anonymous patterns with $:
+        id = `$${anonymousIndex}`;
+        anonymousIndex++;
+      }
+      pPatterns[id] = this;
+      return this;
+    };
+    Pattern.prototype.q = function (id) {
+      return silence;
+    };
+    try {
+      for (let i = 1; i < 10; ++i) {
+        Object.defineProperty(Pattern.prototype, `d${i}`, {
+          get() {
+            return this.p(i);
+          },
+          configurable: true,
+        });
+        Object.defineProperty(Pattern.prototype, `p${i}`, {
+          get() {
+            return this.p(i);
+          },
+          configurable: true,
+        });
+        Pattern.prototype[`q${i}`] = silence;
+      }
+    } catch (err) {
+      console.warn('injectPatternMethods: error:', err);
+    }
+    const cpm = register('cpm', function (cpm, pat) {
+      return pat._fast(cpm / 60 / scheduler.cps);
+    });
+    return evalScope({
+      all,
+      hush,
+      cpm,
+      setCps,
+      setcps: setCps,
+      setCpm,
+      setcpm: setCpm,
+    });
+  };
+
   const evaluate = async (code, autostart = true, shouldHush = true) => {
     if (!code) {
       throw new Error('no code to evaluate');
     }
     try {
       updateState({ code, pending: true });
+      await injectPatternMethods();
       await beforeEval?.({ code });
       shouldHush && hush();
       let { pattern, meta } = await _evaluate(code, transpiler);
@@ -94,88 +166,27 @@ export function repl({
       afterEval?.({ code, pattern, meta });
       return pattern;
     } catch (err) {
-      // console.warn(`[repl] eval error: ${err.message}`);
       logger(`[eval] error: ${err.message}`, 'error');
+      console.error(err);
       updateState({ evalError: err, pending: false });
       onEvalError?.(err);
     }
   };
-  const stop = () => scheduler.stop();
-  const start = () => scheduler.start();
-  const pause = () => scheduler.pause();
-  const toggle = () => scheduler.toggle();
-  const setCps = (cps) => scheduler.setCps(cps);
-  const setCpm = (cpm) => scheduler.setCps(cpm / 60);
-
-  // the following functions use the cps value, which is why they are defined here..
-  const loopAt = register('loopAt', (cycles, pat) => {
-    return pat.loopAtCps(cycles, scheduler.cps);
-  });
-
-  Pattern.prototype.p = function (id) {
-    pPatterns[id] = this;
-    return this;
-  };
-  Pattern.prototype.q = function (id) {
-    return silence;
-  };
-
-  const all = function (transform) {
-    allTransform = transform;
-    return silence;
-  };
-  try {
-    for (let i = 1; i < 10; ++i) {
-      Object.defineProperty(Pattern.prototype, `d${i}`, {
-        get() {
-          return this.p(i);
-        },
-      });
-      Object.defineProperty(Pattern.prototype, `p${i}`, {
-        get() {
-          return this.p(i);
-        },
-      });
-      Pattern.prototype[`q${i}`] = silence;
-    }
-  } catch (err) {
-    // already defined..
-  }
-
-  const fit = register('fit', (pat) =>
-    pat.withHap((hap) =>
-      hap.withValue((v) => ({
-        ...v,
-        speed: scheduler.cps / hap.whole.duration, // overwrite speed completely?
-        unit: 'c',
-      })),
-    ),
-  );
-
-  evalScope({
-    loopAt,
-    fit,
-    all,
-    hush,
-    setCps,
-    setcps: setCps,
-    setCpm,
-    setcpm: setCpm,
-  });
   const setCode = (code) => updateState({ code });
   return { scheduler, evaluate, start, stop, pause, setCps, setPattern, setCode, toggle, state };
 }
 
 export const getTrigger =
   ({ getTime, defaultOutput }) =>
-  async (hap, deadline, duration, cps) => {
+  async (hap, deadline, duration, cps, t) => {
+    // TODO: get rid of deadline after https://github.com/tidalcycles/strudel/pull/1004
     try {
       if (!hap.context.onTrigger || !hap.context.dominantTrigger) {
-        await defaultOutput(hap, deadline, duration, cps);
+        await defaultOutput(hap, deadline, duration, cps, t);
       }
       if (hap.context.onTrigger) {
         // call signature of output / onTrigger is different...
-        await hap.context.onTrigger(getTime() + deadline, hap, getTime(), cps);
+        await hap.context.onTrigger(getTime() + deadline, hap, getTime(), cps, t);
       }
     } catch (err) {
       logger(`[cyclist] error: ${err.message}`, 'error');

packages/core/signal.mjs

@@ -7,7 +7,7 @@ This program is free software: you can redistribute it and/or modify it under th
 import { Hap } from './hap.mjs';
 import { Pattern, fastcat, reify, silence, stack, register } from './pattern.mjs';
 import Fraction from './fraction.mjs';
-import { id, _mod, clamp } from './util.mjs';
+import { id, _mod, clamp, objectMap } from './util.mjs';
 
 export function steady(value) {
   // A continuous value
@@ -27,9 +27,11 @@ export const isaw2 = isaw.toBipolar();
  *
  * @return {Pattern}
  * @example
- * "c3 [eb3,g3] g2 [g3,bb3]".note().clip(saw.slow(4))
+ * note("<c3 [eb3,g3] g2 [g3,bb3]>*8")
+ * .clip(saw.slow(2))
  * @example
- * saw.range(0,8).segment(8).scale('C major').slow(4).note()
+ * n(saw.range(0,8).segment(8))
+ * .scale('C major')
  *
  */
 export const saw = signal((t) => t % 1);
@@ -42,7 +44,8 @@ export const sine2 = signal((t) => Math.sin(Math.PI * 2 * t));
  *
  * @return {Pattern}
  * @example
- * sine.segment(16).range(0,15).slow(2).scale('C minor').note()
+ * n(sine.segment(16).range(0,15))
+ * .scale("C:minor")
  *
  */
 export const sine = sine2.fromBipolar();
@@ -52,7 +55,8 @@ export const sine = sine2.fromBipolar();
  *
  * @return {Pattern}
  * @example
- * stack(sine,cosine).segment(16).range(0,15).slow(2).scale('C minor').note()
+ * n(stack(sine,cosine).segment(16).range(0,15))
+ * .scale("C:minor")
  *
  */
 export const cosine = sine._early(Fraction(1).div(4));
@@ -63,7 +67,7 @@ export const cosine2 = sine2._early(Fraction(1).div(4));
  *
  * @return {Pattern}
  * @example
- * square.segment(2).range(0,7).scale('C minor').note()
+ * n(square.segment(4).range(0,7)).scale("C:minor")
  *
  */
 export const square = signal((t) => Math.floor((t * 2) % 2));
@@ -74,7 +78,7 @@ export const square2 = square.toBipolar();
  *
  * @return {Pattern}
  * @example
- * tri.segment(8).range(0,7).scale('C minor').note()
+ * n(tri.segment(8).range(0,7)).scale("C:minor")
  *
  */
 export const tri = fastcat(isaw, saw);
@@ -82,6 +86,38 @@ export const tri2 = fastcat(isaw2, saw2);
 
 export const time = signal(id);
 
+/**
+ *  The mouse's x position value ranges from 0 to 1.
+ * @name mousex
+ * @return {Pattern}
+ * @example
+ * n(mousex.segment(4).range(0,7)).scale("C:minor")
+ *
+ */
+
+/**
+ *  The mouse's y position value ranges from 0 to 1.
+ * @name mousey
+ * @return {Pattern}
+ * @example
+ * n(mousey.segment(4).range(0,7)).scale("C:minor")
+ *
+ */
+let _mouseY = 0,
+  _mouseX = 0;
+if (typeof window !== 'undefined') {
+  //document.onmousemove = (e) => {
+  document.addEventListener('mousemove', (e) => {
+    _mouseY = e.clientY / document.body.clientHeight;
+    _mouseX = e.clientX / document.body.clientWidth;
+  });
+}
+
+export const mousey = signal(() => _mouseY);
+export const mouseY = signal(() => _mouseY);
+export const mousex = signal(() => _mouseX);
+export const mouseX = signal(() => _mouseX);
+
 // random signals
 
 const xorwise = (x) => {
@@ -118,8 +154,8 @@ const timeToRands = (t, n) => timeToRandsPrime(timeToIntSeed(t), n);
 /**
  * A discrete pattern of numbers from 0 to n-1
  * @example
- * run(4).scale('C4 major').note()
- * // "0 1 2 3".scale('C4 major').note()
+ * n(run(4)).scale("C4:pentatonic")
+ * // n("0 1 2 3").scale("C4:pentatonic")
  */
 export const run = (n) => saw.range(0, n).floor().segment(n);
 
@@ -129,7 +165,7 @@ export const run = (n) => saw.range(0, n).floor().segment(n);
  * @name rand
  * @example
  * // randomly change the cutoff
- * s("bd sd,hh*4").cutoff(rand.range(500,2000))
+ * s("bd*4,hh*8").cutoff(rand.range(500,8000))
  *
  */
 export const rand = signal(timeToRand);
@@ -139,7 +175,24 @@ export const rand = signal(timeToRand);
 export const rand2 = rand.toBipolar();
 
 export const _brandBy = (p) => rand.fmap((x) => x < p);
+
+/**
+ * A continuous pattern of 0 or 1 (binary random), with a probability for the value being 1
+ *
+ * @name brandBy
+ * @param {number} probability - a number between 0 and 1
+ * @example
+ * s("hh*10").pan(brandBy(0.2))
+ */
 export const brandBy = (pPat) => reify(pPat).fmap(_brandBy).innerJoin();
+
+/**
+ * A continuous pattern of 0 or 1 (binary random)
+ *
+ * @name brand
+ * @example
+ * s("hh*10").pan(brand)
+ */
 export const brand = _brandBy(0.5);
 
 export const _irand = (i) => rand.fmap((x) => Math.trunc(x * i));
@@ -151,36 +204,188 @@ export const _irand = (i) => rand.fmap((x) => Math.trunc(x * i));
  * @param {number} n max value (exclusive)
  * @example
  * // randomly select scale notes from 0 - 7 (= C to C)
- * irand(8).struct("x(3,8)").scale('C minor').note()
+ * n(irand(8)).struct("x x*2 x x*3").scale("C:minor")
  *
  */
 export const irand = (ipat) => reify(ipat).fmap(_irand).innerJoin();
 
-/**
- * pick from the list of values (or patterns of values) via the index using the given
- * pattern of integers
+const _pick = function (lookup, pat, modulo = true) {
+  const array = Array.isArray(lookup);
+  const len = Object.keys(lookup).length;
+
+  lookup = objectMap(lookup, reify);
+
+  if (len === 0) {
+    return silence;
+  }
+  return pat.fmap((i) => {
+    let key = i;
+    if (array) {
+      key = modulo ? Math.round(key) % len : clamp(Math.round(key), 0, lookup.length - 1);
+    }
+    return lookup[key];
+  });
+};
+
+/** * Picks patterns (or plain values) either from a list (by index) or a lookup table (by name).
+ * Similar to `inhabit`, but maintains the structure of the original patterns.
  * @param {Pattern} pat
  * @param {*} xs
  * @returns {Pattern}
  * @example
- * note(pick("<0 1 [2!2] 3>", ["g a", "e f", "f g f g" , "g a c d"]))
+ * note("<0 1 2!2 3>".pick(["g a", "e f", "f g f g" , "g c d"]))
+ * @example
+ * sound("<0 1 [2,0]>".pick(["bd sd", "cp cp", "hh hh"]))
+ * @example
+ * sound("<0!2 [0,1] 1>".pick(["bd(3,8)", "sd sd"]))
+ * @example
+ * s("<a!2 [a,b] b>".pick({a: "bd(3,8)", b: "sd sd"}))
  */
 
-export const pick = (pat, xs) => {
-  xs = xs.map(reify);
-  if (xs.length == 0) {
-    return silence;
+export const pick = function (lookup, pat) {
+  // backward compatibility - the args used to be flipped
+  if (Array.isArray(pat)) {
+    [pat, lookup] = [lookup, pat];
   }
-  return pat
-    .fmap((i) => {
-      const key = clamp(Math.round(i), 0, xs.length - 1);
-      return xs[key];
-    })
-    .innerJoin();
+  return __pick(lookup, pat);
 };
 
+const __pick = register('pick', function (lookup, pat) {
+  return _pick(lookup, pat, false).innerJoin();
+});
+
+/** * The same as `pick`, but if you pick a number greater than the size of the list,
+ * it wraps around, rather than sticking at the maximum value.
+ * For example, if you pick the fifth pattern of a list of three, you'll get the
+ * second one.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+
+export const pickmod = register('pickmod', function (lookup, pat) {
+  return _pick(lookup, pat, true).innerJoin();
+});
+
+/** * pickF lets you use a pattern of numbers to pick which function to apply to another pattern.
+ * @param {Pattern} pat
+ * @param {Pattern} lookup a pattern of indices
+ * @param {function[]} funcs the array of functions from which to pull
+ * @returns {Pattern}
+ * @example
+ * s("bd [rim hh]").pickF("<0 1 2>", [rev,jux(rev),fast(2)])
+ * @example
+ * note("<c2 d2>(3,8)").s("square")
+ *     .pickF("<0 2> 1", [jux(rev),fast(2),x=>x.lpf(800)])
+ */
+export const pickF = register('pickF', function (lookup, funcs, pat) {
+  return pat.apply(pick(lookup, funcs));
+});
+
+/** * The same as `pickF`, but if you pick a number greater than the size of the functions list,
+ * it wraps around, rather than sticking at the maximum value.
+ * @param {Pattern} pat
+ * @param {Pattern} lookup a pattern of indices
+ * @param {function[]} funcs the array of functions from which to pull
+ * @returns {Pattern}
+ */
+export const pickmodF = register('pickmodF', function (lookup, funcs, pat) {
+  return pat.apply(pickmod(lookup, funcs));
+});
+
+/** * Similar to `pick`, but it applies an outerJoin instead of an innerJoin.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickOut = register('pickOut', function (lookup, pat) {
+  return _pick(lookup, pat, false).outerJoin();
+});
+
+/** * The same as `pickOut`, but if you pick a number greater than the size of the list,
+ * it wraps around, rather than sticking at the maximum value.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickmodOut = register('pickmodOut', function (lookup, pat) {
+  return _pick(lookup, pat, true).outerJoin();
+});
+
+/** * Similar to `pick`, but the choosen pattern is restarted when its index is triggered.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickRestart = register('pickRestart', function (lookup, pat) {
+  return _pick(lookup, pat, false).restartJoin();
+});
+
+/** * The same as `pickRestart`, but if you pick a number greater than the size of the list,
+ * it wraps around, rather than sticking at the maximum value.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickmodRestart = register('pickmodRestart', function (lookup, pat) {
+  return _pick(lookup, pat, true).restartJoin();
+});
+
+/** * Similar to `pick`, but the choosen pattern is reset when its index is triggered.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickReset = register('pickReset', function (lookup, pat) {
+  return _pick(lookup, pat, false).resetJoin();
+});
+
+/** * The same as `pickReset`, but if you pick a number greater than the size of the list,
+ * it wraps around, rather than sticking at the maximum value.
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+export const pickmodReset = register('pickmodReset', function (lookup, pat) {
+  return _pick(lookup, pat, true).resetJoin();
+});
+
 /**
- * pick from the list of values (or patterns of values) via the index using the given
+/** * Picks patterns (or plain values) either from a list (by index) or a lookup table (by name).
+ * Similar to `pick`, but cycles are squeezed into the target ('inhabited') pattern.
+ * @name inhabit
+ * @synonyms pickSqueeze
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ * @example
+ * "<a b [a,b]>".inhabit({a: s("bd(3,8)"),
+                          b: s("cp sd")
+                         })
+ * @example
+ * s("a@2 [a b] a".inhabit({a: "bd(3,8)", b: "sd sd"})).slow(4)
+ */
+export const { inhabit, pickSqueeze } = register(['inhabit', 'pickSqueeze'], function (lookup, pat) {
+  return _pick(lookup, pat, false).squeezeJoin();
+});
+
+/** * The same as `inhabit`, but if you pick a number greater than the size of the list,
+ * it wraps around, rather than sticking at the maximum value.
+ * For example, if you pick the fifth pattern of a list of three, you'll get the
+ * second one.
+ * @name inhabitmod
+ * @synonyms pickmodSqueeze
+ * @param {Pattern} pat
+ * @param {*} xs
+ * @returns {Pattern}
+ */
+
+export const { inhabitmod, pickmodSqueeze } = register(['inhabitmod', 'pickmodSqueeze'], function (lookup, pat) {
+  return _pick(lookup, pat, true).squeezeJoin();
+});
+
+/**
+ * Pick from the list of values (or patterns of values) via the index using the given
  * pattern of integers. The selected pattern will be compressed to fit the duration of the selecting event
  * @param {Pattern} pat
  * @param {*} xs
@@ -241,6 +446,8 @@ export const chooseInWith = (pat, xs) => {
  * Chooses randomly from the given list of elements.
  * @param  {...any} xs values / patterns to choose from.
  * @returns {Pattern} - a continuous pattern.
+ * @example
+ * note("c2 g2!2 d2 f1").s(choose("sine", "triangle", "bd:6"))
  */
 export const choose = (...xs) => chooseWith(rand, xs);
 
@@ -267,11 +474,12 @@ Pattern.prototype.choose2 = function (...xs) {
 
 /**
  * Picks one of the elements at random each cycle.
+ * @synonyms randcat
  * @returns {Pattern}
  * @example
- * chooseCycles("bd", "hh", "sd").s().fast(4)
+ * chooseCycles("bd", "hh", "sd").s().fast(8)
  * @example
- * "bd | hh | sd".s().fast(4)
+ * s("bd | hh | sd").fast(8)
  */
 export const chooseCycles = (...xs) => chooseInWith(rand.segment(1), xs);
 
@@ -295,9 +503,27 @@ const _wchooseWith = function (pat, ...pairs) {
 
 const wchooseWith = (...args) => _wchooseWith(...args).outerJoin();
 
+/**
+ * Chooses randomly from the given list of elements by giving a probability to each element
+ * @param {...any} pairs arrays of value and weight
+ * @returns {Pattern} - a continuous pattern.
+ * @example
+ * note("c2 g2!2 d2 f1").s(wchoose(["sine",10], ["triangle",1], ["bd:6",1]))
+ */
 export const wchoose = (...pairs) => wchooseWith(rand, ...pairs);
 
-export const wchooseCycles = (...pairs) => _wchooseWith(rand, ...pairs).innerJoin();
+/**
+ * Picks one of the elements at random each cycle by giving a probability to each element
+ * @synonyms wrandcat
+ * @returns {Pattern}
+ * @example
+ * wchooseCycles(["bd",10], ["hh",1], ["sd",1]).s().fast(8)
+ * @example
+ * wchooseCycles(["bd bd bd",5], ["hh hh hh",3], ["sd sd sd",1]).fast(4).s()
+ */
+export const wchooseCycles = (...pairs) => _wchooseWith(rand.segment(1), ...pairs).innerJoin();
+
+export const wrandcat = wchooseCycles;
 
 // this function expects pat to be a pattern of floats...
 export const perlinWith = (pat) => {
@@ -314,7 +540,7 @@ export const perlinWith = (pat) => {
  * @name perlin
  * @example
  * // randomly change the cutoff
- * s("bd sd,hh*4").cutoff(perlin.range(500,2000))
+ * s("bd*4,hh*8").cutoff(perlin.range(500,8000))
  *
  */
 export const perlin = perlinWith(time.fmap((v) => Number(v)));
@@ -356,7 +582,7 @@ export const degradeBy = register('degradeBy', function (x, pat) {
 export const degrade = register('degrade', (pat) => pat._degradeBy(0.5));
 
 /**
- * Inverse of {@link Pattern#degradeBy}: Randomly removes events from the pattern by a given amount.
+ * Inverse of `degradeBy`: Randomly removes events from the pattern by a given amount.
  * 0 = 100% chance of removal
  * 1 = 0% chance of removal
  * Events that would be removed by degradeBy are let through by undegradeBy and vice versa (see second example).
@@ -367,6 +593,11 @@ export const degrade = register('degrade', (pat) => pat._degradeBy(0.5));
  * @returns Pattern
  * @example
  * s("hh*8").undegradeBy(0.2)
+ * @example
+ * s("hh*10").layer(
+ *   x => x.degradeBy(0.2).pan(0),
+ *   x => x.undegradeBy(0.8).pan(1)
+ * )
  */
 export const undegradeBy = register('undegradeBy', function (x, pat) {
   return pat._degradeByWith(
@@ -375,12 +606,27 @@ export const undegradeBy = register('undegradeBy', function (x, pat) {
   );
 });
 
+/**
+ * Inverse of `degrade`: Randomly removes 50% of events from the pattern. Shorthand for `.undegradeBy(0.5)`
+ * Events that would be removed by degrade are let through by undegrade and vice versa (see second example).
+ *
+ * @name undegrade
+ * @memberof Pattern
+ * @returns Pattern
+ * @example
+ * s("hh*8").undegrade()
+ * @example
+ * s("hh*10").layer(
+ *   x => x.degrade().pan(0),
+ *   x => x.undegrade().pan(1)
+ * )
+ */
 export const undegrade = register('undegrade', (pat) => pat._undegradeBy(0.5));
 
 /**
  *
  * Randomly applies the given function by the given probability.
- * Similar to {@link Pattern#someCyclesBy}
+ * Similar to `someCyclesBy`
  *
  * @name sometimesBy
  * @memberof Pattern
@@ -388,7 +634,7 @@ export const undegrade = register('undegrade', (pat) => pat._undegradeBy(0.5));
  * @param {function} function - the transformation to apply
  * @returns Pattern
  * @example
- * s("hh(3,8)").sometimesBy(.4, x=>x.speed("0.5"))
+ * s("hh*8").sometimesBy(.4, x=>x.speed("0.5"))
  */
 
 export const sometimesBy = register('sometimesBy', function (patx, func, pat) {
@@ -406,7 +652,7 @@ export const sometimesBy = register('sometimesBy', function (patx, func, pat) {
  * @param {function} function - the transformation to apply
  * @returns Pattern
  * @example
- * s("hh*4").sometimes(x=>x.speed("0.5"))
+ * s("hh*8").sometimes(x=>x.speed("0.5"))
  */
 export const sometimes = register('sometimes', function (func, pat) {
   return pat._sometimesBy(0.5, func);
@@ -415,7 +661,7 @@ export const sometimes = register('sometimes', function (func, pat) {
 /**
  *
  * Randomly applies the given function by the given probability on a cycle by cycle basis.
- * Similar to {@link Pattern#sometimesBy}
+ * Similar to `sometimesBy`
  *
  * @name someCyclesBy
  * @memberof Pattern
@@ -423,7 +669,7 @@ export const sometimes = register('sometimes', function (func, pat) {
  * @param {function} function - the transformation to apply
  * @returns Pattern
  * @example
- * s("hh(3,8)").someCyclesBy(.3, x=>x.speed("0.5"))
+ * s("bd,hh*8").someCyclesBy(.3, x=>x.speed("0.5"))
  */
 
 export const someCyclesBy = register('someCyclesBy', function (patx, func, pat) {
@@ -445,7 +691,7 @@ export const someCyclesBy = register('someCyclesBy', function (patx, func, pat)
  * @memberof Pattern
  * @returns Pattern
  * @example
- * s("hh(3,8)").someCycles(x=>x.speed("0.5"))
+ * s("bd,hh*8").someCycles(x=>x.speed("0.5"))
  */
 export const someCycles = register('someCycles', function (func, pat) {
   return pat._someCyclesBy(0.5, func);

packages/core/test/controls.test.mjs

@@ -4,25 +4,39 @@ Copyright (C) 2023 Strudel contributors - see <https://github.com/tidalcycles/st
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import controls from '../controls.mjs';
+import { s, pan } from '../controls.mjs';
 import { mini } from '../../mini/mini.mjs';
 import { describe, it, expect } from 'vitest';
+import Fraction from '../fraction.mjs';
 
 describe('controls', () => {
   it('should support controls', () => {
-    expect(controls.s('bd').firstCycleValues).toEqual([{ s: 'bd' }]);
+    expect(s('bd').firstCycleValues).toEqual([{ s: 'bd' }]);
   });
   it('should support compound controls', () => {
-    expect(controls.s(mini('bd:3')).firstCycleValues).toEqual([{ s: 'bd', n: 3 }]);
-    expect(controls.s(mini('bd:3 sd:4:1.4')).firstCycleValues).toEqual([
+    expect(s(mini('bd:3')).firstCycleValues).toEqual([{ s: 'bd', n: 3 }]);
+    expect(s(mini('bd:3 sd:4:1.4')).firstCycleValues).toEqual([
       { s: 'bd', n: 3 },
       { s: 'sd', n: 4, gain: 1.4 },
     ]);
   });
   it('should support ignore extra elements in compound controls', () => {
-    expect(controls.s(mini('bd:3:0.4 sd:4:0.5:3:17')).firstCycleValues).toEqual([
+    expect(s(mini('bd:3:0.4 sd:4:0.5:3:17')).firstCycleValues).toEqual([
       { s: 'bd', n: 3, gain: 0.4 },
       { s: 'sd', n: 4, gain: 0.5 },
     ]);
   });
+  it('should support nested controls', () => {
+    expect(s(mini('bd').pan(1)).firstCycleValues).toEqual([{ s: 'bd', pan: 1 }]);
+    expect(s(mini('bd:1').pan(1)).firstCycleValues).toEqual([{ s: 'bd', n: 1, pan: 1 }]);
+  });
+  it('preserves tactus of the left pattern', () => {
+    expect(s(mini('bd cp mt').pan(mini('1 2 3 4'))).tactus).toEqual(Fraction(3));
+  });
+  it('preserves tactus of the right pattern for .out', () => {
+    expect(s(mini('bd cp mt').set.out(pan(mini('1 2 3 4')))).tactus).toEqual(Fraction(4));
+  });
+  it('combines tactus of the pattern for .mix as lcm', () => {
+    expect(s(mini('bd cp mt').set.mix(pan(mini('1 2 3 4')))).tactus).toEqual(Fraction(12));
+  });
 });

packages/core/test/pattern.test.mjs

@@ -21,8 +21,8 @@ import {
   cat,
   sequence,
   palindrome,
-  polymeter,
-  polymeterSteps,
+  s_polymeter,
+  s_polymeterSteps,
   polyrhythm,
   silence,
   fast,
@@ -46,13 +46,18 @@ import {
   rev,
   time,
   run,
+  pick,
+  stackLeft,
+  stackRight,
+  stackCentre,
+  s_cat,
+  calculateTactus,
 } from '../index.mjs';
 
 import { steady } from '../signal.mjs';
 
-import controls from '../controls.mjs';
+import { n, s } from '../controls.mjs';
 
-const { n, s } = controls;
 const st = (begin, end) => new State(ts(begin, end));
 const ts = (begin, end) => new TimeSpan(Fraction(begin), Fraction(end));
 const hap = (whole, part, value, context = {}) => new Hap(whole, part, value, context);
@@ -181,18 +186,18 @@ describe('Pattern', () => {
         new Hap(ts(1 / 2, 2 / 3), ts(1 / 2, 2 / 3), 7),
       ]);
     });
-    it('can Trig() structure', () => {
+    it('can Reset() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .add.trig(20, 30)
+          .add.reset(20, 30)
           .early(2),
         sequence(26, 27, 36, 37),
       );
     });
-    it('can Trigzero() structure', () => {
+    it('can Restart() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .add.trigzero(20, 30)
+          .add.restart(20, 30)
           .early(2),
         sequence(21, 22, 31, 32),
       );
@@ -233,18 +238,18 @@ describe('Pattern', () => {
         new Hap(ts(1 / 2, 2 / 3), ts(1 / 2, 2 / 3), 2),
       ]);
     });
-    it('can Trig() structure', () => {
+    it('can Reset() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .keep.trig(20, 30)
+          .keep.reset(20, 30)
           .early(2),
         sequence(6, 7, 6, 7),
       );
     });
-    it('can Trigzero() structure', () => {
+    it('can Restart() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .keep.trigzero(20, 30)
+          .keep.restart(20, 30)
           .early(2),
         sequence(1, 2, 1, 2),
       );
@@ -279,18 +284,18 @@ describe('Pattern', () => {
         new Hap(ts(1 / 2, 2 / 3), ts(1 / 2, 2 / 3), 2),
       ]);
     });
-    it('can Trig() structure', () => {
+    it('can Reset() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .keepif.trig(false, true)
+          .keepif.reset(false, true)
           .early(2),
         sequence(silence, silence, 6, 7),
       );
     });
-    it('can Trigzero() structure', () => {
+    it('can Restart() structure', () => {
       sameFirst(
         slowcat(sequence(1, 2, 3, 4), 5, sequence(6, 7, 8, 9), 10)
-          .keepif.trigzero(false, true)
+          .keepif.restart(false, true)
           .early(2),
         sequence(silence, silence, 1, 2),
       );
@@ -603,16 +608,19 @@ describe('Pattern', () => {
       );
     });
   });
-  describe('polymeter()', () => {
-    it('Can layer up cycles, stepwise', () => {
-      expect(polymeterSteps(3, ['d', 'e']).firstCycle()).toStrictEqual(
+  describe('s_polymeter()', () => {
+    it('Can layer up cycles, stepwise, with lists', () => {
+      expect(s_polymeterSteps(3, ['d', 'e']).firstCycle()).toStrictEqual(
         fastcat(pure('d'), pure('e'), pure('d')).firstCycle(),
       );
 
-      expect(polymeter(['a', 'b', 'c'], ['d', 'e']).fast(2).firstCycle()).toStrictEqual(
+      expect(s_polymeter(['a', 'b', 'c'], ['d', 'e']).fast(2).firstCycle()).toStrictEqual(
         stack(sequence('a', 'b', 'c', 'a', 'b', 'c'), sequence('d', 'e', 'd', 'e', 'd', 'e')).firstCycle(),
       );
     });
+    it('Can layer up cycles, stepwise, with weighted patterns', () => {
+      sameFirst(s_polymeterSteps(3, sequence('a', 'b')).fast(2), sequence('a', 'b', 'a', 'b', 'a', 'b'));
+    });
   });
 
   describe('firstOf()', () => {
@@ -1057,4 +1065,148 @@ describe('Pattern', () => {
       expect(slowcat(0, 1).repeatCycles(2).fast(6).firstCycleValues).toStrictEqual([0, 0, 1, 1, 0, 0]);
     });
   });
+  describe('inhabit', () => {
+    it('Can pattern named patterns', () => {
+      expect(
+        sameFirst(
+          sequence('a', 'b', stack('a', 'b')).inhabit({ a: sequence(1, 2), b: sequence(10, 20, 30) }),
+          sequence([1, 2], [10, 20, 30], stack([1, 2], [10, 20, 30])),
+        ),
+      );
+    });
+    it('Can pattern indexed patterns', () => {
+      expect(
+        sameFirst(
+          sequence('0', '1', stack('0', '1')).inhabit([sequence(1, 2), sequence(10, 20, 30)]),
+          sequence([1, 2], [10, 20, 30], stack([1, 2], [10, 20, 30])),
+        ),
+      );
+    });
+  });
+  describe('pick', () => {
+    it('Can pattern named patterns', () => {
+      expect(
+        sameFirst(
+          sequence('a', 'b', 'a', stack('a', 'b')).pick({ a: sequence(1, 2, 3, 4), b: sequence(10, 20, 30, 40) }),
+          sequence(1, 20, 3, stack(4, 40)),
+        ),
+      );
+    });
+    it('Can pattern indexed patterns', () => {
+      expect(
+        sameFirst(
+          sequence(0, 1, 0, stack(0, 1)).pick([sequence(1, 2, 3, 4), sequence(10, 20, 30, 40)]),
+          sequence(1, 20, 3, stack(4, 40)),
+        ),
+      );
+    });
+    it('Clamps indexes', () => {
+      expect(
+        sameFirst(sequence(0, 1, 2, 3).pick([sequence(1, 2, 3, 4), sequence(10, 20, 30, 40)]), sequence(1, 20, 30, 40)),
+      );
+    });
+    it('Is backwards compatible', () => {
+      expect(
+        sameFirst(
+          pick([sequence('a', 'b'), sequence('c', 'd')], sequence(0, 1)),
+          pick(sequence(0, 1), [sequence('a', 'b'), sequence('c', 'd')]),
+        ),
+      );
+    });
+  });
+  describe('pickmod', () => {
+    it('Wraps indexes', () => {
+      expect(
+        sameFirst(
+          sequence(0, 1, 2, 3).pickmod([sequence(1, 2, 3, 4), sequence(10, 20, 30, 40)]),
+          sequence(1, 20, 3, 40),
+        ),
+      );
+    });
+  });
+  describe('tactus', () => {
+    it('Is correctly preserved/calculated through transformations', () => {
+      expect(sequence(0, 1, 2, 3).linger(4).tactus).toStrictEqual(Fraction(4));
+      expect(sequence(0, 1, 2, 3).iter(4).tactus).toStrictEqual(Fraction(4));
+      expect(sequence(0, 1, 2, 3).fast(4).tactus).toStrictEqual(Fraction(4));
+      expect(sequence(0, 1, 2, 3).hurry(4).tactus).toStrictEqual(Fraction(4));
+      expect(sequence(0, 1, 2, 3).rev().tactus).toStrictEqual(Fraction(4));
+      expect(sequence(1).segment(10).tactus).toStrictEqual(Fraction(10));
+      expect(sequence(1, 0, 1).invert().tactus).toStrictEqual(Fraction(3));
+      expect(sequence({ s: 'bev' }, { s: 'amenbreak' }).chop(4).tactus).toStrictEqual(Fraction(8));
+      expect(sequence({ s: 'bev' }, { s: 'amenbreak' }).striate(4).tactus).toStrictEqual(Fraction(8));
+      expect(sequence({ s: 'bev' }, { s: 'amenbreak' }).slice(4, sequence(0, 1, 2, 3)).tactus).toStrictEqual(
+        Fraction(4),
+      );
+      expect(sequence({ s: 'bev' }, { s: 'amenbreak' }).splice(4, sequence(0, 1, 2, 3)).tactus).toStrictEqual(
+        Fraction(4),
+      );
+      expect(sequence({ n: 0 }, { n: 1 }, { n: 2 }).chop(4).tactus).toStrictEqual(Fraction(12));
+      expect(
+        pure((x) => x + 1)
+          .setTactus(3)
+          .appBoth(pure(1).setTactus(2)).tactus,
+      ).toStrictEqual(Fraction(6));
+      expect(
+        pure((x) => x + 1)
+          .setTactus(undefined)
+          .appBoth(pure(1).setTactus(2)).tactus,
+      ).toStrictEqual(Fraction(2));
+      expect(
+        pure((x) => x + 1)
+          .setTactus(3)
+          .appBoth(pure(1).setTactus(undefined)).tactus,
+      ).toStrictEqual(Fraction(3));
+      expect(stack(fastcat(0, 1, 2), fastcat(3, 4)).tactus).toStrictEqual(Fraction(6));
+      expect(stack(fastcat(0, 1, 2), fastcat(3, 4).setTactus(undefined)).tactus).toStrictEqual(Fraction(3));
+      expect(stackLeft(fastcat(0, 1, 2, 3), fastcat(3, 4)).tactus).toStrictEqual(Fraction(4));
+      expect(stackRight(fastcat(0, 1, 2), fastcat(3, 4)).tactus).toStrictEqual(Fraction(3));
+      // maybe this should double when they are either all even or all odd
+      expect(stackCentre(fastcat(0, 1, 2), fastcat(3, 4)).tactus).toStrictEqual(Fraction(3));
+      expect(fastcat(0, 1).ply(3).tactus).toStrictEqual(Fraction(6));
+      expect(fastcat(0, 1).setTactus(undefined).ply(3).tactus).toStrictEqual(undefined);
+      expect(fastcat(0, 1).fast(3).tactus).toStrictEqual(Fraction(2));
+      expect(fastcat(0, 1).setTactus(undefined).fast(3).tactus).toStrictEqual(undefined);
+    });
+  });
+  describe('s_cat', () => {
+    it('can cat', () => {
+      expect(sameFirst(s_cat(fastcat(0, 1, 2, 3), fastcat(4, 5)), fastcat(0, 1, 2, 3, 4, 5)));
+      expect(sameFirst(s_cat(pure(1), pure(2), pure(3)), fastcat(1, 2, 3)));
+    });
+    it('calculates undefined tactuses as the average', () => {
+      expect(sameFirst(s_cat(pure(1), pure(2), pure(3).setTactus(undefined)), fastcat(1, 2, 3)));
+    });
+  });
+  describe('s_taper', () => {
+    it('can taper', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_taper(1, 5), sequence(0, 1, 2, 3, 4, 0, 1, 2, 3, 0, 1, 2, 0, 1, 0)));
+    });
+    it('can taper backwards', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_taper(-1, 5), sequence(0, 0, 1, 0, 1, 2, 0, 1, 2, 3, 0, 1, 2, 3, 4)));
+    });
+  });
+  describe('s_add and s_sub', () => {
+    it('can add from the left', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_add(2), sequence(0, 1)));
+    });
+    it('can sub to the left', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_sub(2), sequence(0, 1, 2)));
+    });
+    it('can add from the right', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_add(-2), sequence(3, 4)));
+    });
+    it('can sub to the right', () => {
+      expect(sameFirst(sequence(0, 1, 2, 3, 4).s_sub(-2), sequence(2, 3, 4)));
+    });
+    it('can subtract nothing', () => {
+      expect(sameFirst(pure('a').s_sub(0), pure('a')));
+    });
+    it('can subtract nothing, repeatedly', () => {
+      expect(sameFirst(pure('a').s_sub(0, 0), fastcat('a', 'a')));
+      for (var i = 0; i < 100; ++i) {
+        expect(sameFirst(pure('a').s_sub(...Array(i).fill(0)), fastcat(...Array(i).fill('a'))));
+      }
+    });
+  });
 });

packages/core/test/value.test.mjs

@@ -6,8 +6,7 @@ This program is free software: you can redistribute it and/or modify it under th
 
 import { describe, it, expect } from 'vitest';
 import { map, valued, mul } from '../value.mjs';
-import controls from '../controls.mjs';
-const { n } = controls;
+import { n } from '../controls.mjs';
 
 describe('Value', () => {
   it('unionWith', () => {
@@ -23,8 +22,4 @@ describe('Value', () => {
     expect(valued(mul).ap(3).ap(3).value).toEqual(9);
     expect(valued(3).mul(3).value).toEqual(9);
   });
-  it('union bare numbers for numeral props', () => {
-    expect(n(3).cutoff(500).add(10).firstCycleValues).toEqual([{ n: 13, cutoff: 510 }]);
-    expect(n(3).cutoff(500).mul(2).firstCycleValues).toEqual([{ n: 6, cutoff: 1000 }]);
-  });
 });

packages/core/ui.mjs

@@ -4,19 +4,6 @@ Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/st
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { getTime } from './time.mjs';
-
-function frame(callback) {
-  if (window.strudelAnimation) {
-    cancelAnimationFrame(window.strudelAnimation);
-  }
-  const animate = (animationTime) => {
-    callback(animationTime, getTime());
-    window.strudelAnimation = requestAnimationFrame(animate);
-  };
-  requestAnimationFrame(animate);
-}
-
 export const backgroundImage = function (src, animateOptions = {}) {
   const container = document.getElementById('code');
   const bg = 'background-image:url(' + src + ');background-size:contain;';
@@ -35,11 +22,6 @@ export const backgroundImage = function (src, animateOptions = {}) {
   if (funcOptions.length === 0) {
     return;
   }
-  frame((_, t) =>
-    funcOptions.forEach(([option, value]) => {
-      handleOption(option, value(t));
-    }),
-  );
 };
 
 export const cleanupUi = () => {

packages/core/util.mjs

@@ -61,6 +61,11 @@ export const valueToMidi = (value, fallbackValue) => {
   return fallbackValue;
 };
 
+// used to schedule external event like midi and osc out
+export const getEventOffsetMs = (targetTimeSeconds, currentTimeSeconds) => {
+  return (targetTimeSeconds - currentTimeSeconds) * 1000;
+};
+
 /**
  * @deprecated does not appear to be referenced or invoked anywhere in the codebase
  * @noAutocomplete
@@ -86,7 +91,7 @@ export const midi2note = (n) => {
 // modulo that works with negative numbers e.g. _mod(-1, 3) = 2. Works on numbers (rather than patterns of numbers, as @mod@ from pattern.mjs does)
 export const _mod = (n, m) => ((n % m) + m) % m;
 
-export function nanFallback(value, fallback) {
+export function nanFallback(value, fallback = 0) {
   if (isNaN(Number(value))) {
     logger(`"${value}" is not a number, falling back to ${fallback}`, 'warning');
     return fallback;
@@ -231,6 +236,14 @@ export const splitAt = function (index, value) {
 
 export const zipWith = (f, xs, ys) => xs.map((n, i) => f(n, ys[i]));
 
+export const pairs = function (xs) {
+  const result = [];
+  for (let i = 0; i < xs.length - 1; ++i) {
+    result.push([xs[i], xs[i + 1]]);
+  }
+  return result;
+};
+
 export const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
 
 /* solmization, not used yet */
@@ -289,6 +302,30 @@ export const sol2note = (n, notation = 'letters') => {
   return note + oct;
 };
 
+// Remove duplicates from list
+export function uniq(a) {
+  var seen = {};
+  return a.filter(function (item) {
+    return seen.hasOwn(item) ? false : (seen[item] = true);
+  });
+}
+
+// Remove duplicates from list, sorting in the process. Mutates argument!
+export function uniqsort(a) {
+  return a.sort().filter(function (item, pos, ary) {
+    return !pos || item != ary[pos - 1];
+  });
+}
+
+// rational version
+export function uniqsortr(a) {
+  return a
+    .sort((x, y) => x.compare(y))
+    .filter(function (item, pos, ary) {
+      return !pos || item.ne(ary[pos - 1]);
+    });
+}
+
 // code hashing helpers
 
 export function unicodeToBase64(text) {
@@ -316,3 +353,30 @@ export function hash2code(hash) {
   return base64ToUnicode(decodeURIComponent(hash));
   //return atob(decodeURIComponent(codeParam || ''));
 }
+
+export function objectMap(obj, fn) {
+  if (Array.isArray(obj)) {
+    return obj.map(fn);
+  }
+  return Object.fromEntries(Object.entries(obj).map(([k, v], i) => [k, fn(v, k, i)]));
+}
+
+// Floating point versions, see Fraction for rational versions
+// // greatest common divisor
+// export const gcd = function (x, y, ...z) {
+//   if (!y && z.length > 0) {
+//     return gcd(x, ...z);
+//   }
+//   if (!y) {
+//     return x;
+//   }
+//   return gcd(y, x % y, ...z);
+// };
+
+// // lowest common multiple
+// export const lcm = function (x, y, ...z) {
+//   if (z.length == 0) {
+//     return (x * y) / gcd(x, y);
+//   }
+//   return lcm((x * y) / gcd(x, y), ...z);
+// };

packages/core/value.mjs

@@ -5,14 +5,13 @@ This program is free software: you can redistribute it and/or modify it under th
 */
 
 import { curry } from './util.mjs';
+import { logger } from './logger.mjs';
 
 export function unionWithObj(a, b, func) {
-  if (typeof b?.value === 'number') {
-    // https://github.com/tidalcycles/strudel/issues/262
-    const numKeys = Object.keys(a).filter((k) => typeof a[k] === 'number');
-    const numerals = Object.fromEntries(numKeys.map((k) => [k, b.value]));
-    b = Object.assign(b, numerals);
-    delete b.value;
+  if (b?.value !== undefined && Object.keys(b).length === 1) {
+    // https://github.com/tidalcycles/strudel/issues/1026
+    logger(`[warn]: Can't do arithmetic on control pattern.`);
+    return a;
   }
   const common = Object.keys(a).filter((k) => Object.keys(b).includes(k));
   return Object.assign({}, a, b, Object.fromEntries(common.map((k) => [k, func(a[k], b[k])])));

packages/core/vite.config.js

@@ -8,8 +8,8 @@ export default defineConfig({
   build: {
     lib: {
       entry: resolve(__dirname, 'index.mjs'),
-      formats: ['es', 'cjs'],
-      fileName: (ext) => ({ es: 'index.mjs', cjs: 'index.js' })[ext],
+      formats: ['es'],
+      fileName: (ext) => ({ es: 'index.mjs' })[ext],
     },
     rollupOptions: {
       external: [...Object.keys(dependencies)],

packages/core/zyklus.mjs

@@ -7,6 +7,9 @@ function createClock(
   duration = 0.05, // duration of each cycle
   interval = 0.1, // interval between callbacks
   overlap = 0.1, // overlap between callbacks
+  setInterval = globalThis.setInterval,
+  clearInterval = globalThis.clearInterval,
+  round = true,
 ) {
   let tick = 0; // counts callbacks
   let phase = 0; // next callback time
@@ -22,9 +25,8 @@ function createClock(
     }
     // callback as long as we're inside the lookahead
     while (phase < lookahead) {
-      phase = Math.round(phase * precision) / precision;
-      phase >= t && callback(phase, duration, tick);
-      phase < t && console.log('TOO LATE', phase); // what if latency is added from outside?
+      phase = round ? Math.round(phase * precision) / precision : phase;
+      callback(phase, duration, tick, t); // callback has to skip / handle phase < t!
       phase += duration; // increment phase by duration
       tick++;
     }
@@ -35,7 +37,10 @@ function createClock(
     onTick();
     intervalID = setInterval(onTick, interval * 1000);
   };
-  const clear = () => intervalID !== undefined && clearInterval(intervalID);
+  const clear = () => {
+    intervalID !== undefined && clearInterval(intervalID);
+    intervalID = undefined;
+  };
   const pause = () => clear();
   const stop = () => {
     tick = 0;

packages/csound/README.md

@@ -0,0 +1 @@
+# @strudel/csound

packages/csound/index.mjs

@@ -1,5 +1,5 @@
-import { getFrequency, logger, register } from '@strudel.cycles/core';
-import { getAudioContext } from '@strudel.cycles/webaudio';
+import { getFrequency, logger, register } from '@strudel/core';
+import { getAudioContext } from '@strudel/webaudio';
 import csd from './project.csd?raw';
 // import livecodeOrc from './livecode.orc?raw';
 import presetsOrc from './presets.orc?raw';
@@ -23,7 +23,7 @@ export const csound = register('csound', (instrument, pat) => {
   instrument = instrument || 'triangle';
   init(); // not async to support csound inside other patterns + to be able to call pattern methods after it
   // TODO: find a alternative way to wait for csound to load (to wait with first time playback)
-  return pat.onTrigger((time, hap) => {
+  return pat.onTrigger((time_deprecate, hap, currentTime, _cps, targetTime) => {
     if (!_csound) {
       logger('[csound] not loaded yet', 'warning');
       return;
@@ -38,9 +38,11 @@ export const csound = register('csound', (instrument, pat) => {
       .join('/');
     // TODO: find out how to send a precise ctx based time
     // http://www.csounds.com/manual/html/i.html
+    const timeOffset = targetTime - currentTime; // latency ?
+    //const timeOffset = time_deprecate - getAudioContext().currentTime
     const params = [
       `"${instrument}"`, // p1: instrument name
-      time - getAudioContext().currentTime, //.toFixed(precision), // p2: starting time in arbitrary unit called beats
+      timeOffset, // p2: starting time in arbitrary unit called beats
       hap.duration + 0, // p3: duration in beats
       // instrument specific params:
       freq, //.toFixed(precision), // p4: frequency
@@ -152,12 +154,14 @@ export const csoundm = register('csoundm', (instrument, pat) => {
     const p2 = tidal_time - getAudioContext().currentTime;
     const p3 = hap.duration.valueOf() + 0;
     const frequency = getFrequency(hap);
+    let { gain = 1, velocity = 0.9 } = hap.value;
+    velocity = gain * velocity;
     // Translate frequency to MIDI key number _without_ rounding.
     const C4 = 261.62558;
     let octave = Math.log(frequency / C4) / Math.log(2.0) + 8.0;
     const p4 = octave * 12.0 - 36.0;
     // We prefer floating point precision, but over the MIDI range [0, 127].
-    const p5 = 127 * (hap.context?.velocity ?? 0.9);
+    const p5 = 127 * velocity;
     // The Strudel controls as a string.
     const p6 = Object.entries({ ...hap.value, frequency })
       .flat()

packages/csound/package.json

@@ -1,11 +1,11 @@
 {
-  "name": "@strudel.cycles/csound",
-  "version": "0.9.0",
+  "name": "@strudel/csound",
+  "version": "1.1.0",
   "description": "csound bindings for strudel",
   "main": "index.mjs",
+  "type": "module",
   "publishConfig": {
-    "main": "dist/index.js",
-    "module": "dist/index.mjs"
+    "main": "dist/index.mjs"
   },
   "scripts": {
     "build": "vite build",
@@ -33,8 +33,8 @@
   "homepage": "https://github.com/tidalcycles/strudel#readme",
   "dependencies": {
     "@csound/browser": "6.18.7",
-    "@strudel.cycles/core": "workspace:*",
-    "@strudel.cycles/webaudio": "workspace:*"
+    "@strudel/core": "workspace:*",
+    "@strudel/webaudio": "workspace:*"
   },
   "devDependencies": {
     "vite": "^5.0.10"

packages/csound/vite.config.js

@@ -8,8 +8,8 @@ export default defineConfig({
   build: {
     lib: {
       entry: resolve(__dirname, 'index.mjs'),
-      formats: ['es', 'cjs'],
-      fileName: (ext) => ({ es: 'index.mjs', cjs: 'index.js' })[ext],
+      formats: ['es'],
+      fileName: (ext) => ({ es: 'index.mjs' })[ext],
     },
     rollupOptions: {
       external: [...Object.keys(dependencies)],

packages/desktopbridge/midibridge.mjs

@@ -1,16 +1,18 @@
 import { Invoke } from './utils.mjs';
-import { Pattern, noteToMidi } from '@strudel.cycles/core';
+import { Pattern, getEventOffsetMs, noteToMidi } from '@strudel/core';
 
 const ON_MESSAGE = 0x90;
 const OFF_MESSAGE = 0x80;
 const CC_MESSAGE = 0xb0;
 
 Pattern.prototype.midi = function (output) {
-  return this.onTrigger((time, hap, currentTime) => {
-    const { note, nrpnn, nrpv, ccn, ccv } = hap.value;
-    const offset = (time - currentTime) * 1000;
-    const velocity = Math.floor((hap.context?.velocity ?? 0.9) * 100); // TODO: refactor velocity
-    const duration = Math.floor(hap.duration.valueOf() * 1000 - 10);
+  return this.onTrigger((time_deprecate, hap, currentTime, cps, targetTime) => {
+    let { note, nrpnn, nrpv, ccn, ccv, velocity = 0.9, gain = 1 } = hap.value;
+    //magic number to get audio engine to line up, can probably be calculated somehow
+    const latencyMs = 34;
+    const offset = getEventOffsetMs(targetTime, currentTime) + latencyMs;
+    velocity = Math.floor(gain * velocity * 100);
+    const duration = Math.floor((hap.duration.valueOf() / cps) * 1000 - 10);
     const roundedOffset = Math.round(offset);
     const midichan = (hap.value.midichan ?? 1) - 1;
     const requestedport = output ?? 'IAC';

packages/desktopbridge/oscbridge.mjs

@@ -1,8 +1,8 @@
-import { parseNumeral, Pattern } from '@strudel.cycles/core';
+import { parseNumeral, Pattern, getEventOffsetMs } from '@strudel/core';
 import { Invoke } from './utils.mjs';
 
 Pattern.prototype.osc = function () {
-  return this.onTrigger(async (time, hap, currentTime, cps = 1) => {
+  return this.onTrigger(async (time, hap, currentTime, cps = 1, targetTime) => {
     hap.ensureObjectValue();
     const cycle = hap.wholeOrPart().begin.valueOf();
     const delta = hap.duration.valueOf();
@@ -13,7 +13,7 @@ Pattern.prototype.osc = function () {
 
     const params = [];
 
-    const timestamp = Math.round(Date.now() + (time - currentTime) * 1000);
+    const timestamp = Math.round(Date.now() + getEventOffsetMs(targetTime, currentTime));
 
     Object.keys(controls).forEach((key) => {
       const val = controls[key];

packages/desktopbridge/package.json

@@ -22,7 +22,7 @@
       "url": "https://github.com/tidalcycles/strudel/issues"
     },
     "dependencies": {
-        "@strudel.cycles/core": "workspace:*",
+        "@strudel/core": "workspace:*",
         "@tauri-apps/api": "^1.5.3"
       },
     "homepage": "https://github.com/tidalcycles/strudel#readme"

packages/draw/README.md

@@ -0,0 +1,9 @@
+# @strudel/canvas
+
+Helpers for drawing with the Canvas API and Strudel
+
+## Install
+
+```sh
+npm i @strudel/canvas --save
+```

packages/draw/animate.mjs

@@ -1,13 +1,14 @@
-import { Pattern, getDrawContext, silence, register, pure } from './index.mjs';
-import controls from './controls.mjs'; // do not import from index.mjs as it breaks for some reason..
-const { createParams } = controls;
+import { Pattern, silence, register, pure, createParams } from '@strudel/core';
+import { getDrawContext } from './draw.mjs';
 
 let clearColor = '#22222210';
 
 Pattern.prototype.animate = function ({ callback, sync = false, smear = 0.5 } = {}) {
   window.frame && cancelAnimationFrame(window.frame);
   const ctx = getDrawContext();
-  const { clientWidth: ww, clientHeight: wh } = ctx.canvas;
+  let { clientWidth: ww, clientHeight: wh } = ctx.canvas;
+  ww *= window.devicePixelRatio;
+  wh *= window.devicePixelRatio;
   let smearPart = smear === 0 ? '99' : Number((1 - smear) * 100).toFixed(0);
   smearPart = smearPart.length === 1 ? `0${smearPart}` : smearPart;
   clearColor = `#200010${smearPart}`;

packages/draw/draw.mjs

@@ -1,80 +1,88 @@
 /*
 draw.mjs - <short description TODO>
-Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/draw.mjs>
+Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/canvas/draw.mjs>
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Pattern, getTime, State, TimeSpan } from './index.mjs';
+import { Pattern, getTime, State, TimeSpan } from '@strudel/core';
 
-export const getDrawContext = (id = 'test-canvas') => {
+export const getDrawContext = (id = 'test-canvas', options) => {
+  let { contextType = '2d', pixelated = false, pixelRatio = window.devicePixelRatio } = options || {};
   let canvas = document.querySelector('#' + id);
   if (!canvas) {
-    const scale = 2; // 2 = crisp on retina screens
     canvas = document.createElement('canvas');
     canvas.id = id;
-    canvas.width = window.innerWidth * scale;
-    canvas.height = window.innerHeight * scale;
+    canvas.width = window.innerWidth * pixelRatio;
+    canvas.height = window.innerHeight * pixelRatio;
     canvas.style = 'pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0';
+    pixelated && (canvas.style.imageRendering = 'pixelated');
     document.body.prepend(canvas);
     let timeout;
     window.addEventListener('resize', () => {
       timeout && clearTimeout(timeout);
       timeout = setTimeout(() => {
-        canvas.width = window.innerWidth * scale;
-        canvas.height = window.innerHeight * scale;
+        canvas.width = window.innerWidth * pixelRatio;
+        canvas.height = window.innerHeight * pixelRatio;
       }, 200);
     });
   }
-  return canvas.getContext('2d');
+  return canvas.getContext(contextType);
 };
 
-Pattern.prototype.draw = function (callback, { from, to, onQuery } = {}) {
+let animationFrames = {};
+function stopAnimationFrame(id) {
+  if (animationFrames[id] !== undefined) {
+    cancelAnimationFrame(animationFrames[id]);
+    delete animationFrames[id];
+  }
+}
+function stopAllAnimations() {
+  Object.keys(animationFrames).forEach((id) => stopAnimationFrame(id));
+}
+
+let memory = {};
+Pattern.prototype.draw = function (fn, options) {
   if (typeof window === 'undefined') {
     return this;
   }
-  if (window.strudelAnimation) {
-    cancelAnimationFrame(window.strudelAnimation);
-  }
-  const ctx = getDrawContext();
-  let cycle,
-    events = [];
-  const animate = (time) => {
-    const t = getTime();
-    if (from !== undefined && to !== undefined) {
-      const currentCycle = Math.floor(t);
-      if (cycle !== currentCycle) {
-        cycle = currentCycle;
-        const begin = currentCycle + from;
-        const end = currentCycle + to;
-        setTimeout(() => {
-          events = this.query(new State(new TimeSpan(begin, end)))
-            .filter(Boolean)
-            .filter((event) => event.part.begin.equals(event.whole.begin));
-          onQuery?.(events);
-        }, 0);
-      }
-    }
-    callback(ctx, events, t, time);
-    window.strudelAnimation = requestAnimationFrame(animate);
+  let { id = 1, lookbehind = 0, lookahead = 0 } = options;
+  let __t = Math.max(getTime(), 0);
+  stopAnimationFrame(id);
+  lookbehind = Math.abs(lookbehind);
+  // init memory, clear future haps of old pattern
+  memory[id] = (memory[id] || []).filter((h) => !h.isInFuture(__t));
+  let newFuture = this.queryArc(__t, __t + lookahead).filter((h) => h.hasOnset());
+  memory[id] = memory[id].concat(newFuture);
+
+  let last;
+  const animate = () => {
+    const _t = getTime();
+    const t = _t + lookahead;
+    // filter out haps that are too far in the past
+    memory[id] = memory[id].filter((h) => h.isInNearPast(lookbehind, _t));
+    // begin where we left off in last frame, but max -0.1s (inactive tab throttles to 1fps)
+    let begin = Math.max(last || t, t - 1 / 10);
+    const haps = this.queryArc(begin, t).filter((h) => h.hasOnset());
+    memory[id] = memory[id].concat(haps);
+    last = t; // makes sure no haps are missed
+    fn(memory[id], _t, t, this);
+    animationFrames[id] = requestAnimationFrame(animate);
   };
-  requestAnimationFrame(animate);
+  animationFrames[id] = requestAnimationFrame(animate);
   return this;
 };
 
 export const cleanupDraw = (clearScreen = true) => {
   const ctx = getDrawContext();
   clearScreen && ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.width);
-  if (window.strudelAnimation) {
-    cancelAnimationFrame(window.strudelAnimation);
-  }
+  stopAllAnimations();
   if (window.strudelScheduler) {
     clearInterval(window.strudelScheduler);
   }
 };
 
-Pattern.prototype.onPaint = function (onPaint) {
-  // this is evil! TODO: add pattern.context
-  this.context = { onPaint };
+Pattern.prototype.onPaint = function () {
+  console.warn('[draw] onPaint was not overloaded. Some drawings might not work');
   return this;
 };
 
@@ -134,7 +142,7 @@ export class Drawer {
         this.lastFrame = phase;
         this.visibleHaps = (this.visibleHaps || [])
           // filter out haps that are too far in the past (think left edge of screen for pianoroll)
-          .filter((h) => h.whole.end >= phase - lookbehind - lookahead)
+          .filter((h) => h.endClipped >= phase - lookbehind - lookahead)
           // add new haps with onset (think right edge bars scrolling in)
           .concat(haps.filter((h) => h.hasOnset()));
         const time = phase - lookahead;
@@ -175,3 +183,27 @@ export class Drawer {
     }
   }
 }
+
+export function getComputedPropertyValue(name) {
+  if (typeof window === 'undefined') {
+    return '#fff';
+  }
+  return getComputedStyle(document.documentElement).getPropertyValue(name);
+}
+
+let theme = {
+  background: '#222',
+  foreground: '#75baff',
+  caret: '#ffcc00',
+  selection: 'rgba(128, 203, 196, 0.5)',
+  selectionMatch: '#036dd626',
+  lineHighlight: '#00000050',
+  gutterBackground: 'transparent',
+  gutterForeground: '#8a919966',
+};
+export function getTheme() {
+  return theme;
+}
+export function setTheme(_theme) {
+  theme = _theme;
+}

packages/draw/index.mjs

@@ -0,0 +1,6 @@
+export * from './animate.mjs';
+export * from './color.mjs';
+export * from './draw.mjs';
+export * from './pianoroll.mjs';
+export * from './spiral.mjs';
+export * from './pitchwheel.mjs';

packages/draw/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@strudel/draw",
+  "version": "1.1.0",
+  "description": "Helpers for drawing with Strudel",
+  "main": "index.mjs",
+  "type": "module",
+  "publishConfig": {
+    "main": "dist/index.mjs"
+  },
+  "scripts": {
+    "build": "vite build",
+    "prepublishOnly": "npm run build"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tidalcycles/strudel.git"
+  },
+  "keywords": [
+    "titdalcycles",
+    "strudel",
+    "pattern",
+    "livecoding",
+    "algorave"
+  ],
+  "author": "Felix Roos <flix91@gmail.com>",
+  "license": "AGPL-3.0-or-later",
+  "bugs": {
+    "url": "https://github.com/tidalcycles/strudel/issues"
+  },
+  "homepage": "https://github.com/tidalcycles/strudel#readme",
+  "dependencies": {
+    "@strudel/core": "workspace:*"
+  },
+  "devDependencies": {
+    "vite": "^5.0.10"
+  }
+}

packages/draw/pianoroll.mjs

@@ -1,10 +1,11 @@
 /*
 pianoroll.mjs - <short description TODO>
-Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/pianoroll.mjs>
+Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/canvas/pianoroll.mjs>
 This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Pattern, noteToMidi, getDrawContext, freqToMidi, isNote } from './index.mjs';
+import { Pattern, noteToMidi, freqToMidi } from '@strudel/core';
+import { getTheme, getDrawContext } from './draw.mjs';
 
 const scale = (normalized, min, max) => normalized * (max - min) + min;
 const getValue = (e) => {
@@ -18,7 +19,13 @@ const getValue = (e) => {
   }
   note = note ?? n;
   if (typeof note === 'string') {
-    return noteToMidi(note);
+    try {
+      // TODO: n(run(32)).scale("D:minor") fails when trying to query negative time..
+      return noteToMidi(note);
+    } catch (err) {
+      // console.warn(`error converting note to midi: ${err}`); // this spams to crazy
+      return 0;
+    }
   }
   if (typeof note === 'number') {
     return note;
@@ -30,25 +37,24 @@ const getValue = (e) => {
 };
 
 Pattern.prototype.pianoroll = function (options = {}) {
-  let { cycles = 4, playhead = 0.5, overscan = 1, hideNegative = false } = options;
+  let { cycles = 4, playhead = 0.5, overscan = 0, hideNegative = false, ctx = getDrawContext(), id = 1 } = options;
 
   let from = -cycles * playhead;
   let to = cycles * (1 - playhead);
-
+  const inFrame = (hap, t) => (!hideNegative || hap.whole.begin >= 0) && hap.isWithinTime(t + from, t + to);
   this.draw(
-    (ctx, haps, t) => {
-      const inFrame = (event) =>
-        (!hideNegative || event.whole.begin >= 0) && event.whole.begin <= t + to && event.endClipped >= t + from;
+    (haps, time) => {
       pianoroll({
         ...options,
-        time: t,
+        time,
         ctx,
-        haps: haps.filter(inFrame),
+        haps: haps.filter((hap) => inFrame(hap, time)),
       });
     },
     {
-      from: from - overscan,
-      to: to + overscan,
+      lookbehind: from - overscan,
+      lookahead: to + overscan,
+      id,
     },
   );
   return this;
@@ -98,14 +104,11 @@ export function pianoroll({
   flipTime = 0,
   flipValues = 0,
   hideNegative = false,
-  // inactive = '#C9E597',
-  // inactive = '#FFCA28',
-  inactive = '#7491D2',
-  active = '#FFCA28',
-  // background = '#2A3236',
+  inactive = getTheme().foreground,
+  active = getTheme().foreground,
   background = 'transparent',
   smear = 0,
-  playheadColor = 'white',
+  playheadColor = getTheme().foreground,
   minMidi = 10,
   maxMidi = 90,
   autorange = 0,
@@ -121,12 +124,17 @@ export function pianoroll({
   colorizeInactive = 1,
   fontFamily,
   ctx,
+  id,
 } = {}) {
   const w = ctx.canvas.width;
   const h = ctx.canvas.height;
   let from = -cycles * playhead;
   let to = cycles * (1 - playhead);
 
+  if (id) {
+    haps = haps.filter((hap) => hap.hasTag(id));
+  }
+
   if (timeframeProp) {
     console.warn('timeframe is deprecated! use from/to instead');
     from = 0;
@@ -160,8 +168,13 @@ export function pianoroll({
     maxMidi = max;
     valueExtent = maxMidi - minMidi + 1;
   }
-  // foldValues = values.sort((a, b) => a - b);
-  foldValues = values.sort((a, b) => String(a).localeCompare(String(b)));
+  foldValues = values.sort((a, b) =>
+    typeof a === 'number' && typeof b === 'number'
+      ? a - b
+      : typeof a === 'number'
+        ? 1
+        : String(a).localeCompare(String(b)),
+  );
   barThickness = fold ? valueAxis / foldValues.length : valueAxis / valueExtent;
   ctx.fillStyle = background;
   ctx.globalAlpha = 1; // reset!
@@ -176,13 +189,14 @@ export function pianoroll({
     if (hideInactive && !isActive) {
       return;
     }
-    let color = event.value?.color || event.context?.color;
+    let color = event.value?.color;
     active = color || active;
     inactive = colorizeInactive ? color || inactive : inactive;
     color = isActive ? active : inactive;
     ctx.fillStyle = fillCurrent ? color : 'transparent';
     ctx.strokeStyle = color;
-    ctx.globalAlpha = event.context.velocity ?? event.value?.gain ?? 1;
+    const { velocity = 1, gain = 1 } = event.value || {};
+    ctx.globalAlpha = velocity * gain;
     const timeProgress = (event.whole.begin - (flipTime ? to : from)) / timeExtent;
     const timePx = scale(timeProgress, ...timeRange);
     let durationPx = scale(event.duration / timeExtent, 0, timeAxis);
@@ -258,8 +272,8 @@ export function getDrawOptions(drawTime, options = {}) {
 
 export const getPunchcardPainter =
   (options = {}) =>
-  (ctx, time, haps, drawTime, paintOptions = {}) =>
-    pianoroll({ ctx, time, haps, ...getDrawOptions(drawTime, { ...paintOptions, ...options }) });
+  (ctx, time, haps, drawTime) =>
+    pianoroll({ ctx, time, haps, ...getDrawOptions(drawTime, options) });
 
 Pattern.prototype.punchcard = function (options) {
   return this.onPaint(getPunchcardPainter(options));

packages/draw/pitchwheel.mjs

@@ -0,0 +1,127 @@
+import { Pattern, midiToFreq, getFrequency } from '@strudel/core';
+import { getTheme, getDrawContext } from './draw.mjs';
+
+const c = midiToFreq(36);
+
+const circlePos = (cx, cy, radius, angle) => {
+  angle = angle * Math.PI * 2;
+  const x = Math.sin(angle) * radius + cx;
+  const y = Math.cos(angle) * radius + cy;
+  return [x, y];
+};
+
+const freq2angle = (freq, root) => {
+  return 0.5 - (Math.log2(freq / root) % 1);
+};
+
+export function pitchwheel({
+  haps,
+  ctx,
+  id,
+  hapcircles = 1,
+  circle = 0,
+  edo = 12,
+  root = c,
+  thickness = 3,
+  hapRadius = 6,
+  mode = 'flake',
+  margin = 10,
+} = {}) {
+  const connectdots = mode === 'polygon';
+  const centerlines = mode === 'flake';
+  const w = ctx.canvas.width;
+  const h = ctx.canvas.height;
+  ctx.clearRect(0, 0, w, h);
+  const color = getTheme().foreground;
+
+  const size = Math.min(w, h);
+  const radius = size / 2 - thickness / 2 - hapRadius - margin;
+  const centerX = w / 2;
+  const centerY = h / 2;
+
+  if (id) {
+    haps = haps.filter((hap) => hap.hasTag(id));
+  }
+  ctx.strokeStyle = color;
+  ctx.fillStyle = color;
+  ctx.globalAlpha = 1;
+  ctx.lineWidth = thickness;
+
+  if (circle) {
+    ctx.beginPath();
+    ctx.arc(centerX, centerY, radius, 0, 2 * Math.PI);
+    ctx.stroke();
+  }
+
+  if (edo) {
+    Array.from({ length: edo }, (_, i) => {
+      const angle = freq2angle(root * Math.pow(2, i / edo), root);
+      const [x, y] = circlePos(centerX, centerY, radius, angle);
+      ctx.beginPath();
+      ctx.arc(x, y, hapRadius, 0, 2 * Math.PI);
+      ctx.fill();
+    });
+    ctx.stroke();
+  }
+
+  let shape = [];
+  ctx.lineWidth = hapRadius;
+  haps.forEach((hap) => {
+    let freq;
+    try {
+      freq = getFrequency(hap);
+    } catch (err) {
+      return;
+    }
+    const angle = freq2angle(freq, root);
+    const [x, y] = circlePos(centerX, centerY, radius, angle);
+    const hapColor = hap.value.color || color;
+    ctx.strokeStyle = hapColor;
+    ctx.fillStyle = hapColor;
+    const { velocity = 1, gain = 1 } = hap.value || {};
+    const alpha = velocity * gain;
+    ctx.globalAlpha = alpha;
+    shape.push([x, y, angle, hapColor, alpha]);
+    ctx.beginPath();
+    if (hapcircles) {
+      ctx.moveTo(x + hapRadius, y);
+      ctx.arc(x, y, hapRadius, 0, 2 * Math.PI);
+      ctx.fill();
+    }
+    if (centerlines) {
+      ctx.moveTo(centerX, centerY);
+      ctx.lineTo(x, y);
+    }
+    ctx.stroke();
+  });
+
+  ctx.strokeStyle = color;
+  ctx.globalAlpha = 1;
+  if (connectdots && shape.length) {
+    shape = shape.sort((a, b) => a[2] - b[2]);
+    ctx.beginPath();
+    ctx.moveTo(shape[0][0], shape[0][1]);
+    shape.forEach(([x, y, _, color, alpha]) => {
+      ctx.strokeStyle = color;
+      ctx.globalAlpha = alpha;
+      ctx.lineTo(x, y);
+    });
+    ctx.lineTo(shape[0][0], shape[0][1]);
+    ctx.stroke();
+  }
+
+  return;
+}
+
+Pattern.prototype.pitchwheel = function (options = {}) {
+  let { ctx = getDrawContext(), id = 1 } = options;
+  return this.tag(id).onPaint((_, time, haps) =>
+    pitchwheel({
+      ...options,
+      time,
+      ctx,
+      haps: haps.filter((hap) => hap.isActive(time)),
+      id,
+    }),
+  );
+};

packages/draw/spiral.mjs

@@ -1,4 +1,5 @@
-import { Pattern } from './index.mjs';
+import { Pattern } from '@strudel/core';
+import { getTheme } from './draw.mjs';
 
 // polar coords -> xy
 function fromPolar(angle, radius, cx, cy) {
@@ -19,7 +20,7 @@ function spiralSegment(options) {
     cy = 100,
     rotate = 0,
     thickness = margin / 2,
-    color = '#0000ff30',
+    color = getTheme().foreground,
     cap = 'round',
     stretch = 1,
     fromOpacity = 1,
@@ -49,70 +50,81 @@ function spiralSegment(options) {
   ctx.stroke();
 }
 
-Pattern.prototype.spiral = function (options = {}) {
-  const {
+function drawSpiral(options) {
+  let {
     stretch = 1,
     size = 80,
     thickness = size / 2,
     cap = 'butt', // round butt squar,
     inset = 3, // start angl,
-    playheadColor = '#ffffff90',
+    playheadColor = '#ffffff',
     playheadLength = 0.02,
     playheadThickness = thickness,
     padding = 0,
     steady = 1,
-    inactiveColor = '#ffffff20',
+    activeColor = getTheme().foreground,
+    inactiveColor = getTheme().gutterForeground,
     colorizeInactive = 0,
     fade = true,
     // logSpiral = true,
+    ctx,
+    time,
+    haps,
+    drawTime,
+    id,
   } = options;
 
-  function spiral({ ctx, time, haps, drawTime }) {
-    const [w, h] = [ctx.canvas.width, ctx.canvas.height];
-    ctx.clearRect(0, 0, w * 2, h * 2);
-    const [cx, cy] = [w / 2, h / 2];
-    const settings = {
-      margin: size / stretch,
-      cx,
-      cy,
-      stretch,
-      cap,
-      thickness,
-    };
-
-    const playhead = {
-      ...settings,
-      thickness: playheadThickness,
-      from: inset - playheadLength,
-      to: inset,
-      color: playheadColor,
-    };
-
-    const [min] = drawTime;
-    const rotate = steady * time;
-    haps.forEach((hap) => {
-      const isActive = hap.whole.begin <= time && hap.endClipped > time;
-      const from = hap.whole.begin - time + inset;
-      const to = hap.endClipped - time + inset - padding;
-      const { color } = hap.context;
-      const opacity = fade ? 1 - Math.abs((hap.whole.begin - time) / min) : 1;
-      spiralSegment({
-        ctx,
-        ...settings,
-        from,
-        to,
-        rotate,
-        color: colorizeInactive || isActive ? color : inactiveColor,
-        fromOpacity: opacity,
-        toOpacity: opacity,
-      });
-    });
-    spiralSegment({
-      ctx,
-      ...playhead,
-      rotate,
-    });
+  if (id) {
+    haps = haps.filter((hap) => hap.hasTag(id));
   }
 
-  return this.onPaint((ctx, time, haps, drawTime) => spiral({ ctx, time, haps, drawTime }));
+  const [w, h] = [ctx.canvas.width, ctx.canvas.height];
+  ctx.clearRect(0, 0, w * 2, h * 2);
+  const [cx, cy] = [w / 2, h / 2];
+  const settings = {
+    margin: size / stretch,
+    cx,
+    cy,
+    stretch,
+    cap,
+    thickness,
+  };
+
+  const playhead = {
+    ...settings,
+    thickness: playheadThickness,
+    from: inset - playheadLength,
+    to: inset,
+    color: playheadColor,
+  };
+
+  const [min] = drawTime;
+  const rotate = steady * time;
+  haps.forEach((hap) => {
+    const isActive = hap.whole.begin <= time && hap.endClipped > time;
+    const from = hap.whole.begin - time + inset;
+    const to = hap.endClipped - time + inset - padding;
+    const hapColor = hap.value?.color || activeColor;
+    const color = colorizeInactive || isActive ? hapColor : inactiveColor;
+    const opacity = fade ? 1 - Math.abs((hap.whole.begin - time) / min) : 1;
+    spiralSegment({
+      ctx,
+      ...settings,
+      from,
+      to,
+      rotate,
+      color,
+      fromOpacity: opacity,
+      toOpacity: opacity,
+    });
+  });
+  spiralSegment({
+    ctx,
+    ...playhead,
+    rotate,
+  });
+}
+
+Pattern.prototype.spiral = function (options = {}) {
+  return this.onPaint((ctx, time, haps, drawTime) => drawSpiral({ ctx, time, haps, drawTime, ...options }));
 };

packages/draw/vite.config.js

@@ -0,0 +1,19 @@
+import { defineConfig } from 'vite';
+import { dependencies } from './package.json';
+import { resolve } from 'path';
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [],
+  build: {
+    lib: {
+      entry: resolve(__dirname, 'index.mjs'),
+      formats: ['es'],
+      fileName: (ext) => ({ es: 'index.mjs' })[ext],
+    },
+    rollupOptions: {
+      external: [...Object.keys(dependencies)],
+    },
+    target: 'esnext',
+  },
+});

packages/embed/README.md

@@ -1,33 +1,64 @@
-# @strudel.cycles/embed
+# @strudel/embed
 
 This package contains a embeddable web component for the Strudel REPL.
 
-## Usage
+## Usage via Script Tag
 
-Either install with `npm i @strudel.cycles/embed` or just use a cdn to import the script:
+Use this code in any HTML file:
 
 ```html
-<script src="https://unpkg.com/@strudel.cycles/embed@latest"></script>
+<script src="https://unpkg.com/@strudel/embed@latest"></script>
 <strudel-repl>
   <!--
-note(`[[e5 [b4 c5] d5 [c5 b4]]
-[a4 [a4 c5] e5 [d5 c5]]
-[b4 [~ c5] d5 e5]
-[c5 a4 a4 ~]
-[[~ d5] [~ f5] a5 [g5 f5]]
-[e5 [~ c5] e5 [d5 c5]]
-[b4 [b4 c5] d5 e5]
-[c5 a4 a4 ~]],
-[[e2 e3]*4]
-[[a2 a3]*4]
-[[g#2 g#3]*2 [e2 e3]*2]
-[a2 a3 a2 a3 a2 a3 b1 c2]
-[[d2 d3]*4]
-[[c2 c3]*4]
-[[b1 b2]*2 [e2 e3]*2]
-[[a1 a2]*4]`).slow(16)
-      -->
+setcps(1)
+n("<0 1 2 3 4>*8").scale('G4 minor')
+.s("gm_lead_6_voice")
+.clip(sine.range(.2,.8).slow(8))
+.jux(rev)
+.room(2)
+.sometimes(add(note("12")))
+.lpf(perlin.range(200,20000).slow(4))
+-->
 </strudel-repl>
 ```
 
-Note that the Code is placed inside HTML comments to prevent the browser from treating it as HTML.
+This will load the strudel website in an iframe, using the code provided within the HTML comments `<!-- -->`.
+The HTML comments are needed to make sure the browser won't interpret it as HTML.
+
+Alternatively you can create a REPL from JavaScript like this:
+
+```html
+<script src="https://unpkg.com/@strudel/embed@1.0.2"></script>
+<div id="strudel"></div>
+<script>
+  let editor = document.createElement('strudel-repl');
+  editor.setAttribute(
+    'code',
+    `setcps(1)
+n("<0 1 2 3 4>*8").scale('G4 minor')
+.s("gm_lead_6_voice")
+.clip(sine.range(.2,.8).slow(8))
+.jux(rev)
+.room(2)
+.sometimes(add(note("12")))
+.lpf(perlin.range(200,20000).slow(4))`,
+  );
+  document.getElementById('strudel').append(editor);
+</script>
+```
+
+When you're using JSX, you could also use the `code` attribute in your markup:
+
+```html
+<script src="https://unpkg.com/@strudel/embed@1.0.2"></script>
+<strudel-repl code={`
+setcps(1)
+n("<0 1 2 3 4>*8").scale('G4 minor')
+.s("gm_lead_6_voice")
+.clip(sine.range(.2,.8).slow(8))
+.jux(rev)
+.room(2)
+.sometimes(add(note("12")))
+.lpf(perlin.range(200,20000).slow(4))
+`}></strudel-repl>
+```

packages/embed/embed.js

@@ -4,7 +4,7 @@ class Strudel extends HTMLElement {
   }
   connectedCallback() {
     setTimeout(() => {
-      const code = (this.innerHTML + '').replace('<!--', '').replace('-->', '').trim();
+      const code = this.getAttribute('code') || (this.innerHTML + '').replace('<!--', '').replace('-->', '').trim();
       const iframe = document.createElement('iframe');
       const src = `https://strudel.cc/#${encodeURIComponent(btoa(code))}`;
       // const src = `http://localhost:3000/#${encodeURIComponent(btoa(code))}`;

packages/embed/package.json

@@ -1,6 +1,6 @@
 {
-  "name": "@strudel.cycles/embed",
-  "version": "0.2.0",
+  "name": "@strudel/embed",
+  "version": "1.1.0",
   "description": "Embeddable Web Component to load a Strudel REPL into an iframe",
   "main": "embed.js",
   "type": "module",

packages/hs2js/.npmignore

@@ -0,0 +1,2 @@
+pnpm-lock.yaml
+vite.config.js

packages/hs2js/LICENSE

@@ -0,0 +1,661 @@
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published
+    by the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<https://www.gnu.org/licenses/>.

packages/hs2js/README.md

@@ -0,0 +1,127 @@
+# hs2js
+
+Experimental haskell in javascript interpreter. Many haskell features are not implemented.
+This projects mainly exists to be able to write and interpret [Tidal Cycles](https://tidalcycles.org/) code in the browser,
+as part of [Strudel](https://github.com/tidalcycles/strudel). This project could only exist thanks to [tree-sitter-haskell](https://github.com/tree-sitter/tree-sitter-haskell).
+
+## Installation
+
+### Via Script Tag
+
+You can load the library directly from a script tag via unpkg:
+
+```html
+<script src="https://unpkg.com/hs2js@0.0.3"></script>
+<button id="hello">hello</button>
+<script>
+  hs2js.setBase('https://unpkg.com/hs2js@0.0.3/dist/');
+  hs2js.loadParser().then(()=>{
+    document.getElementById('hello').addEventListener('click', () => {
+      hs2js.evaluate('alert "hello from haskell!"');
+    });
+  })
+</script>
+```
+
+### Via npm
+
+You need to add `postinstall` to your `package.json` script to copy the parser to your `public` folder:
+
+```json
+{
+  "scripts": {
+    "postinstall": "cp node_modules/hs2js/dist/tree-sitter.wasm public && cp node_modules/hs2js/dist/tree-sitter-haskell.wasm public"
+  }
+}
+```
+
+Depending on your setup, replace `public` with the folder that will serve your assets to `/`. Then install the package:
+
+```sh
+npm i hs2js
+```
+
+and use it:
+
+```js
+import * as hs2js from 'hs2js';
+hs2js.loadParser();
+document.getElementById('hello').addEventListener('click', () => {
+  hs2js.evaluate('alert "hello from haskell!"');
+});
+```
+
+## API
+
+These are all functions exported by the package:
+
+### evaluate
+
+Evaluates a piece of haskell code
+
+- `code`: [valid](https://github.com/tree-sitter/tree-sitter-haskell?tab=readme-ov-file#supported-language-extensions) haskell code
+- `scope`: global scope, defaults to globalThis. Allows you to pass an object of your own functions / variables from JS to Haskell.
+- `ops`: mapping for custom infix operator
+
+Example:
+
+```js
+// simple
+hs2js.evaluate(`2 + 2`) // = 4
+// passing variables via scope:
+hs2js.evaluate(`a + b`, { a: 1, b: 2 }) // = 3
+// custom operator
+hs2js.evaluate(`2 |* 3`, {}, { '|*': (l, r) => l * r }) // = 6
+```
+
+### parse
+
+[Parses](https://github.com/tree-sitter/tree-sitter-haskell) a piece of haskell code, returning its AST representation.
+
+Example:
+
+```js
+const ast = hs2js.parse(`2 + 2`)
+console.log(ast.toString())
+// (haskell declarations: (declarations (top_splice (apply function: (variable) argument: (literal (integer))))))
+```
+
+### run
+
+Evaluates `rootNode` of haskell AST (used by evaluate internally).
+
+- `rootNode`: haskell AST root node, as returned by `parse`
+- `scope`: see evaluate
+- `ops`: see evaluate
+
+Example:
+
+```js
+const ast = hs2js.parse(`2 + 3`);
+const res = hs2js.run(ast.rootNode);
+console.log(res); // = 5
+```
+
+### loadParser
+
+Loads and caches the parser by fetching `tree-sitter.wasm` and `tree-sitter-haskell.wasm`.
+Make sure to call and await this function before calling `parse` or `evaluate`.
+
+```js
+hs2js.loadParser().then(() => hs2js.evaluate('alert "ready"'))
+```
+
+### setBase
+
+Sets the base path where the WASM files are expected by `loadParser`. Defaults to `/`.
+Expects `tree-sitter.wasm` and `tree-sitter-haskell.wasm` to be present.
+Can either be a relative path or a URL.
+
+```js
+hs2js.setBase('https://unpkg.com/hs2js@0.0.4/dist/');
+hs2js.loadParser(); 
+/* loads 
+- https://unpkg.com/hs2js@0.0.4/dist/tree-sitter.wasm
+- https://unpkg.com/hs2js@0.0.4/dist/tree-sitter-haskell.wasm
+*/
+```

packages/hs2js/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "hs2js",
+  "version": "0.1.0",
+  "description": "Experimental Haskell in JavaScript interpreter",
+  "main": "src/index.mjs",
+  "type": "module",
+  "publishConfig": {
+    "main": "dist/index.js",
+    "module": "dist/index.mjs"
+  },
+  "scripts": {
+    "build-wasm": "tree-sitter build-wasm node_modules/tree-sitter-haskell && mv tree-sitter-haskell.wasm ./dist/ && cp node_modules/web-tree-sitter/tree-sitter.wasm ./dist/",
+    "build": "vite build && npm run build-wasm",
+    "prepublishOnly": "npm run build"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tidalcycles/strudel.git"
+  },
+  "keywords": [
+    "haskell",
+    "javascript"
+  ],
+  "author": "Felix Roos <flix91@gmail.com>",
+  "license": "AGPL-3.0-or-later",
+  "bugs": {
+    "url": "https://github.com/tidalcycles/strudel/issues"
+  },
+  "homepage": "https://github.com/tidalcycles/strudel",
+  "dependencies": {
+    "web-tree-sitter": "^0.20.8"
+  },
+  "devDependencies": {
+    "tree-sitter-haskell": "^0.21.0",
+    "vite": "^5.0.10"
+  }
+}

packages/hs2js/pnpm-lock.yaml

@@ -0,0 +1,520 @@
+lockfileVersion: '6.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+dependencies:
+  web-tree-sitter:
+    specifier: ^0.20.8
+    version: 0.20.8
+
+devDependencies:
+  tree-sitter-haskell:
+    specifier: ^0.21.0
+    version: 0.21.0(tree-sitter@0.21.1)
+  vite:
+    specifier: ^5.0.10
+    version: 5.2.11
+
+packages:
+
+  /@esbuild/aix-ppc64@0.20.2:
+    resolution: {integrity: sha512-D+EBOJHXdNZcLJRBkhENNG8Wji2kgc9AZ9KiPr1JuZjsNtyHzrsfLRrY0tk2H2aoFu6RANO1y1iPPUCDYWkb5g==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [aix]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/android-arm64@0.20.2:
+    resolution: {integrity: sha512-mRzjLacRtl/tWU0SvD8lUEwb61yP9cqQo6noDZP/O8VkwafSYwZ4yWy24kan8jE/IMERpYncRt2dw438LP3Xmg==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/android-arm@0.20.2:
+    resolution: {integrity: sha512-t98Ra6pw2VaDhqNWO2Oph2LXbz/EJcnLmKLGBJwEwXX/JAN83Fym1rU8l0JUWK6HkIbWONCSSatf4sf2NBRx/w==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/android-x64@0.20.2:
+    resolution: {integrity: sha512-btzExgV+/lMGDDa194CcUQm53ncxzeBrWJcncOBxuC6ndBkKxnHdFJn86mCIgTELsooUmwUm9FkhSp5HYu00Rg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/darwin-arm64@0.20.2:
+    resolution: {integrity: sha512-4J6IRT+10J3aJH3l1yzEg9y3wkTDgDk7TSDFX+wKFiWjqWp/iCfLIYzGyasx9l0SAFPT1HwSCR+0w/h1ES/MjA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/darwin-x64@0.20.2:
+    resolution: {integrity: sha512-tBcXp9KNphnNH0dfhv8KYkZhjc+H3XBkF5DKtswJblV7KlT9EI2+jeA8DgBjp908WEuYll6pF+UStUCfEpdysA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/freebsd-arm64@0.20.2:
+    resolution: {integrity: sha512-d3qI41G4SuLiCGCFGUrKsSeTXyWG6yem1KcGZVS+3FYlYhtNoNgYrWcvkOoaqMhwXSMrZRl69ArHsGJ9mYdbbw==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/freebsd-x64@0.20.2:
+    resolution: {integrity: sha512-d+DipyvHRuqEeM5zDivKV1KuXn9WeRX6vqSqIDgwIfPQtwMP4jaDsQsDncjTDDsExT4lR/91OLjRo8bmC1e+Cw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-arm64@0.20.2:
+    resolution: {integrity: sha512-9pb6rBjGvTFNira2FLIWqDk/uaf42sSyLE8j1rnUpuzsODBq7FvpwHYZxQ/It/8b+QOS1RYfqgGFNLRI+qlq2A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-arm@0.20.2:
+    resolution: {integrity: sha512-VhLPeR8HTMPccbuWWcEUD1Az68TqaTYyj6nfE4QByZIQEQVWBB8vup8PpR7y1QHL3CpcF6xd5WVBU/+SBEvGTg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-ia32@0.20.2:
+    resolution: {integrity: sha512-o10utieEkNPFDZFQm9CoP7Tvb33UutoJqg3qKf1PWVeeJhJw0Q347PxMvBgVVFgouYLGIhFYG0UGdBumROyiig==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-loong64@0.20.2:
+    resolution: {integrity: sha512-PR7sp6R/UC4CFVomVINKJ80pMFlfDfMQMYynX7t1tNTeivQ6XdX5r2XovMmha/VjR1YN/HgHWsVcTRIMkymrgQ==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-mips64el@0.20.2:
+    resolution: {integrity: sha512-4BlTqeutE/KnOiTG5Y6Sb/Hw6hsBOZapOVF6njAESHInhlQAghVVZL1ZpIctBOoTFbQyGW+LsVYZ8lSSB3wkjA==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-ppc64@0.20.2:
+    resolution: {integrity: sha512-rD3KsaDprDcfajSKdn25ooz5J5/fWBylaaXkuotBDGnMnDP1Uv5DLAN/45qfnf3JDYyJv/ytGHQaziHUdyzaAg==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-riscv64@0.20.2:
+    resolution: {integrity: sha512-snwmBKacKmwTMmhLlz/3aH1Q9T8v45bKYGE3j26TsaOVtjIag4wLfWSiZykXzXuE1kbCE+zJRmwp+ZbIHinnVg==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-s390x@0.20.2:
+    resolution: {integrity: sha512-wcWISOobRWNm3cezm5HOZcYz1sKoHLd8VL1dl309DiixxVFoFe/o8HnwuIwn6sXre88Nwj+VwZUvJf4AFxkyrQ==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/linux-x64@0.20.2:
+    resolution: {integrity: sha512-1MdwI6OOTsfQfek8sLwgyjOXAu+wKhLEoaOLTjbijk6E2WONYpH9ZU2mNtR+lZ2B4uwr+usqGuVfFT9tMtGvGw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/netbsd-x64@0.20.2:
+    resolution: {integrity: sha512-K8/DhBxcVQkzYc43yJXDSyjlFeHQJBiowJ0uVL6Tor3jGQfSGHNNJcWxNbOI8v5k82prYqzPuwkzHt3J1T1iZQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/openbsd-x64@0.20.2:
+    resolution: {integrity: sha512-eMpKlV0SThJmmJgiVyN9jTPJ2VBPquf6Kt/nAoo6DgHAoN57K15ZghiHaMvqjCye/uU4X5u3YSMgVBI1h3vKrQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/sunos-x64@0.20.2:
+    resolution: {integrity: sha512-2UyFtRC6cXLyejf/YEld4Hajo7UHILetzE1vsRcGL3earZEW77JxrFjH4Ez2qaTiEfMgAXxfAZCm1fvM/G/o8w==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/win32-arm64@0.20.2:
+    resolution: {integrity: sha512-GRibxoawM9ZCnDxnP3usoUDO9vUkpAxIIZ6GQI+IlVmr5kP3zUq+l17xELTHMWTWzjxa2guPNyrpq1GWmPvcGQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/win32-ia32@0.20.2:
+    resolution: {integrity: sha512-HfLOfn9YWmkSKRQqovpnITazdtquEW8/SoHW7pWpuEeguaZI4QnCRW6b+oZTztdBnZOS2hqJ6im/D5cPzBTTlQ==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@esbuild/win32-x64@0.20.2:
+    resolution: {integrity: sha512-N49X4lJX27+l9jbLKSqZ6bKNjzQvHaT8IIFUy+YIqmXQdjYCToGWwOItDrfby14c78aDd5NHQl29xingXfCdLQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-android-arm-eabi@4.17.2:
+    resolution: {integrity: sha512-NM0jFxY8bB8QLkoKxIQeObCaDlJKewVlIEkuyYKm5An1tdVZ966w2+MPQ2l8LBZLjR+SgyV+nRkTIunzOYBMLQ==}
+    cpu: [arm]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-android-arm64@4.17.2:
+    resolution: {integrity: sha512-yeX/Usk7daNIVwkq2uGoq2BYJKZY1JfyLTaHO/jaiSwi/lsf8fTFoQW/n6IdAsx5tx+iotu2zCJwz8MxI6D/Bw==}
+    cpu: [arm64]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-darwin-arm64@4.17.2:
+    resolution: {integrity: sha512-kcMLpE6uCwls023+kknm71ug7MZOrtXo+y5p/tsg6jltpDtgQY1Eq5sGfHcQfb+lfuKwhBmEURDga9N0ol4YPw==}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-darwin-x64@4.17.2:
+    resolution: {integrity: sha512-AtKwD0VEx0zWkL0ZjixEkp5tbNLzX+FCqGG1SvOu993HnSz4qDI6S4kGzubrEJAljpVkhRSlg5bzpV//E6ysTQ==}
+    cpu: [x64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-arm-gnueabihf@4.17.2:
+    resolution: {integrity: sha512-3reX2fUHqN7sffBNqmEyMQVj/CKhIHZd4y631duy0hZqI8Qoqf6lTtmAKvJFYa6bhU95B1D0WgzHkmTg33In0A==}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-arm-musleabihf@4.17.2:
+    resolution: {integrity: sha512-uSqpsp91mheRgw96xtyAGP9FW5ChctTFEoXP0r5FAzj/3ZRv3Uxjtc7taRQSaQM/q85KEKjKsZuiZM3GyUivRg==}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-arm64-gnu@4.17.2:
+    resolution: {integrity: sha512-EMMPHkiCRtE8Wdk3Qhtciq6BndLtstqZIroHiiGzB3C5LDJmIZcSzVtLRbwuXuUft1Cnv+9fxuDtDxz3k3EW2A==}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-arm64-musl@4.17.2:
+    resolution: {integrity: sha512-NMPylUUZ1i0z/xJUIx6VUhISZDRT+uTWpBcjdv0/zkp7b/bQDF+NfnfdzuTiB1G6HTodgoFa93hp0O1xl+/UbA==}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-powerpc64le-gnu@4.17.2:
+    resolution: {integrity: sha512-T19My13y8uYXPw/L/k0JYaX1fJKFT/PWdXiHr8mTbXWxjVF1t+8Xl31DgBBvEKclw+1b00Chg0hxE2O7bTG7GQ==}
+    cpu: [ppc64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-riscv64-gnu@4.17.2:
+    resolution: {integrity: sha512-BOaNfthf3X3fOWAB+IJ9kxTgPmMqPPH5f5k2DcCsRrBIbWnaJCgX2ll77dV1TdSy9SaXTR5iDXRL8n7AnoP5cg==}
+    cpu: [riscv64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-s390x-gnu@4.17.2:
+    resolution: {integrity: sha512-W0UP/x7bnn3xN2eYMql2T/+wpASLE5SjObXILTMPUBDB/Fg/FxC+gX4nvCfPBCbNhz51C+HcqQp2qQ4u25ok6g==}
+    cpu: [s390x]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-x64-gnu@4.17.2:
+    resolution: {integrity: sha512-Hy7pLwByUOuyaFC6mAr7m+oMC+V7qyifzs/nW2OJfC8H4hbCzOX07Ov0VFk/zP3kBsELWNFi7rJtgbKYsav9QQ==}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-linux-x64-musl@4.17.2:
+    resolution: {integrity: sha512-h1+yTWeYbRdAyJ/jMiVw0l6fOOm/0D1vNLui9iPuqgRGnXA0u21gAqOyB5iHjlM9MMfNOm9RHCQ7zLIzT0x11Q==}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-win32-arm64-msvc@4.17.2:
+    resolution: {integrity: sha512-tmdtXMfKAjy5+IQsVtDiCfqbynAQE/TQRpWdVataHmhMb9DCoJxp9vLcCBjEQWMiUYxO1QprH/HbY9ragCEFLA==}
+    cpu: [arm64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-win32-ia32-msvc@4.17.2:
+    resolution: {integrity: sha512-7II/QCSTAHuE5vdZaQEwJq2ZACkBpQDOmQsE6D6XUbnBHW8IAhm4eTufL6msLJorzrHDFv3CF8oCA/hSIRuZeQ==}
+    cpu: [ia32]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@rollup/rollup-win32-x64-msvc@4.17.2:
+    resolution: {integrity: sha512-TGGO7v7qOq4CYmSBVEYpI1Y5xDuCEnbVC5Vth8mOsW0gDSzxNrVERPc790IGHsrT2dQSimgMr9Ub3Y1Jci5/8w==}
+    cpu: [x64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /@types/estree@1.0.5:
+    resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
+    dev: true
+
+  /esbuild@0.20.2:
+    resolution: {integrity: sha512-WdOOppmUNU+IbZ0PaDiTst80zjnrOkyJNHoKupIcVyU8Lvla3Ugx94VzkQ32Ijqd7UhHJy75gNWDMUekcrSJ6g==}
+    engines: {node: '>=12'}
+    hasBin: true
+    requiresBuild: true
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.20.2
+      '@esbuild/android-arm': 0.20.2
+      '@esbuild/android-arm64': 0.20.2
+      '@esbuild/android-x64': 0.20.2
+      '@esbuild/darwin-arm64': 0.20.2
+      '@esbuild/darwin-x64': 0.20.2
+      '@esbuild/freebsd-arm64': 0.20.2
+      '@esbuild/freebsd-x64': 0.20.2
+      '@esbuild/linux-arm': 0.20.2
+      '@esbuild/linux-arm64': 0.20.2
+      '@esbuild/linux-ia32': 0.20.2
+      '@esbuild/linux-loong64': 0.20.2
+      '@esbuild/linux-mips64el': 0.20.2
+      '@esbuild/linux-ppc64': 0.20.2
+      '@esbuild/linux-riscv64': 0.20.2
+      '@esbuild/linux-s390x': 0.20.2
+      '@esbuild/linux-x64': 0.20.2
+      '@esbuild/netbsd-x64': 0.20.2
+      '@esbuild/openbsd-x64': 0.20.2
+      '@esbuild/sunos-x64': 0.20.2
+      '@esbuild/win32-arm64': 0.20.2
+      '@esbuild/win32-ia32': 0.20.2
+      '@esbuild/win32-x64': 0.20.2
+    dev: true
+
+  /fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
+  /nanoid@3.3.7:
+    resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+    dev: true
+
+  /node-addon-api@8.0.0:
+    resolution: {integrity: sha512-ipO7rsHEBqa9STO5C5T10fj732ml+5kLN1cAG8/jdHd56ldQeGj3Q7+scUS+VHK/qy1zLEwC4wMK5+yM0btPvw==}
+    engines: {node: ^18 || ^20 || >= 21}
+    dev: true
+
+  /node-gyp-build@4.8.1:
+    resolution: {integrity: sha512-OSs33Z9yWr148JZcbZd5WiAXhh/n9z8TxQcdMhIOlpN9AhWpLfvVFO73+m77bBABQMaY9XSvIa+qk0jlI7Gcaw==}
+    hasBin: true
+    dev: true
+
+  /picocolors@1.0.1:
+    resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==}
+    dev: true
+
+  /postcss@8.4.38:
+    resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==}
+    engines: {node: ^10 || ^12 || >=14}
+    dependencies:
+      nanoid: 3.3.7
+      picocolors: 1.0.1
+      source-map-js: 1.2.0
+    dev: true
+
+  /rollup@4.17.2:
+    resolution: {integrity: sha512-/9ClTJPByC0U4zNLowV1tMBe8yMEAxewtR3cUNX5BoEpGH3dQEWpJLr6CLp0fPdYRF/fzVOgvDb1zXuakwF5kQ==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+    dependencies:
+      '@types/estree': 1.0.5
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.17.2
+      '@rollup/rollup-android-arm64': 4.17.2
+      '@rollup/rollup-darwin-arm64': 4.17.2
+      '@rollup/rollup-darwin-x64': 4.17.2
+      '@rollup/rollup-linux-arm-gnueabihf': 4.17.2
+      '@rollup/rollup-linux-arm-musleabihf': 4.17.2
+      '@rollup/rollup-linux-arm64-gnu': 4.17.2
+      '@rollup/rollup-linux-arm64-musl': 4.17.2
+      '@rollup/rollup-linux-powerpc64le-gnu': 4.17.2
+      '@rollup/rollup-linux-riscv64-gnu': 4.17.2
+      '@rollup/rollup-linux-s390x-gnu': 4.17.2
+      '@rollup/rollup-linux-x64-gnu': 4.17.2
+      '@rollup/rollup-linux-x64-musl': 4.17.2
+      '@rollup/rollup-win32-arm64-msvc': 4.17.2
+      '@rollup/rollup-win32-ia32-msvc': 4.17.2
+      '@rollup/rollup-win32-x64-msvc': 4.17.2
+      fsevents: 2.3.3
+    dev: true
+
+  /source-map-js@1.2.0:
+    resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==}
+    engines: {node: '>=0.10.0'}
+    dev: true
+
+  /tree-sitter-haskell@0.21.0(tree-sitter@0.21.1):
+    resolution: {integrity: sha512-b2RLegPHuYPh7nJ3YKWgkWnFYxmYlQDE8TDJuNH+iuNuBcCMYyaA9JlJlMHfCvf7DmJNPtqqbO9Kh9NXEmbatQ==}
+    requiresBuild: true
+    peerDependencies:
+      tree-sitter: ^0.21.0
+      tree_sitter: '*'
+    peerDependenciesMeta:
+      tree_sitter:
+        optional: true
+    dependencies:
+      node-addon-api: 8.0.0
+      node-gyp-build: 4.8.1
+      tree-sitter: 0.21.1
+    dev: true
+
+  /tree-sitter@0.21.1:
+    resolution: {integrity: sha512-7dxoA6kYvtgWw80265MyqJlkRl4yawIjO7S5MigytjELkX43fV2WsAXzsNfO7sBpPPCF5Gp0+XzHk0DwLCq3xQ==}
+    requiresBuild: true
+    dependencies:
+      node-addon-api: 8.0.0
+      node-gyp-build: 4.8.1
+    dev: true
+
+  /vite@5.2.11:
+    resolution: {integrity: sha512-HndV31LWW05i1BLPMUCE1B9E9GFbOu1MbenhS58FuK6owSO5qHm7GiCotrNY1YE5rMeQSFBGmT5ZaLEjFizgiQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^18.0.0 || >=20.0.0
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+    dependencies:
+      esbuild: 0.20.2
+      postcss: 8.4.38
+      rollup: 4.17.2
+    optionalDependencies:
+      fsevents: 2.3.3
+    dev: true
+
+  /web-tree-sitter@0.20.8:
+    resolution: {integrity: sha512-weOVgZ3aAARgdnb220GqYuh7+rZU0Ka9k9yfKtGAzEYMa6GgiCzW9JjQRJyCJakvibQW+dfjJdihjInKuuCAUQ==}
+    dev: false