move scheduler to core + move audioctx to userland

packages/core/clockworker.mjs

@@ -0,0 +1,71 @@
+/*
+clockworker.mjs - <short description TODO>
+Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/clockworker.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/>.
+*/
+
+// helpers to create a worker dynamically without needing a server / extra file
+const stringifyFunction = (func) => '(' + func + ')();';
+const urlifyFunction = (func) => URL.createObjectURL(new Blob([stringifyFunction(func)], { type: 'text/javascript' }));
+const createWorker = (func) => new Worker(urlifyFunction(func));
+
+// this is just a setInterval with a counter, running in a worker
+export class ClockWorker {
+  worker;
+  interval = 0.1; // query span
+  tick = 0;
+  constructor(callback, interval = this.interval) {
+    this.interval = interval;
+    this.worker = createWorker(() => {
+      // we cannot use closures here!
+      let interval;
+      let timerID = null; // this is clock #1 (the sloppy js clock)
+      const clear = () => {
+        if (timerID) {
+          clearInterval(timerID);
+          timerID = null;
+        }
+      };
+      const start = () => {
+        clear();
+        if (!interval) {
+          throw new Error('no interval set! call worker.postMessage({interval}) before starting.');
+        }
+        postMessage('tick');
+        timerID = setInterval(() => postMessage('tick'), interval * 1000);
+      };
+      self.onmessage = function (e) {
+        if (e.data == 'start') {
+          start();
+        } else if (e.data.interval) {
+          interval = e.data.interval;
+          if (timerID) {
+            start();
+          }
+        } else if (e.data == 'stop') {
+          clear();
+        }
+      };
+    });
+    this.worker.postMessage({ interval });
+    // const round = (n, d) => Math.round(n * d) / d;
+    this.worker.onmessage = (e) => {
+      if (e.data === 'tick') {
+        // callback with query span, using clock #2 (the audio clock)
+        callback(this.tick++, this.interval);
+      }
+    };
+  }
+  start() {
+    // console.log('start...');
+    this.worker.postMessage('start');
+  }
+  stop() {
+    // console.log('stop...');
+    this.worker.postMessage('stop');
+    this.tick = 0;
+  }
+  setInterval(interval) {
+    this.worker.postMessage({ interval });
+  }
+}

packages/core/examples/repl.html

@@ -0,0 +1,85 @@
+<div style="position: absolute; bottom: 0; right: 0; padding: 4px; width: 100vw; display: flex">
+  <button id="start" style="font-size: 2em">start</button>
+  <button id="stop" style="font-size: 2em">stop</button>
+  <button id="slower" style="font-size: 2em">slower</button>
+  <button id="faster" style="font-size: 2em">faster</button>
+</div>
+<textarea
+  style="font-size: 2em; background: #052b49; color: #fff; height: 100%; width: 100%; outline: none; border: 0"
+  id="text"
+  spellcheck="false"
+>
+Loading...</textarea
+>
+<script type="module">
+  document.body.style = 'margin: 0';
+  import * as strudel from '@strudel.cycles/core';
+
+  const { cat, State, TimeSpan, Scheduler, getPlayableNoteValue, getFreq } = strudel;
+  Object.assign(window, strudel); // add strudel to eval scope
+
+  const ctx = new AudioContext();
+  const scheduler = new Scheduler({
+    // audioContext: getAudioContext(),
+    interval: 0.1,
+    onTrigger: (hap, time, duration) => {
+      const freq = getFrequency(hap);
+      const osc = ctx.createOscillator();
+      const gain = 0.2;
+      osc.frequency.value = freq;
+      osc.type = 'triangle';
+      const onset = ctx.currentTime + time;
+      const offset = onset + duration;
+      const attack = 0.05;
+      const release = 0.05;
+      osc.start(onset);
+      osc.stop(offset + release);
+
+      const g = ctx.createGain();
+      g.gain.setValueAtTime(gain, onset);
+      g.gain.linearRampToValueAtTime(gain, onset + attack);
+      g.gain.setValueAtTime(gain, offset - release);
+      g.gain.linearRampToValueAtTime(0, offset);
+      osc.connect(g);
+      g.connect(ctx.destination);
+    },
+  });
+
+  let initialCode = `sequence(1,2).mul(55/2) // frequencies
+  .mul(slowcat(1,2))
+  .mul(slowcat(1,3/2,4/3,5/3).slow(8))
+  .fast(3)
+  .freq()
+  .velocity(.5)
+  .s('sawtooth')
+  .cutoff(800)
+  .out()
+  `;
+
+  try {
+    const base64 = decodeURIComponent(window.location.href.split('#')[1]);
+    initialCode = atob(base64);
+  } catch (err) {
+    console.warn('failed to decode', err);
+  }
+  const input = document.getElementById('text');
+  input.value = initialCode;
+  const evaluate = () => {
+    try {
+      const pattern = eval(input.value);
+      scheduler.setPattern(pattern);
+      window.location.hash = '#' + encodeURIComponent(btoa(input.value)); // update url hash
+    } catch (err) {
+      console.warn(err);
+    }
+  };
+  evaluate();
+  input.addEventListener('input', () => evaluate());
+  document.getElementById('start').addEventListener('click', () => {
+    ctx.resume();
+    scheduler.start();
+  });
+  document.getElementById('stop').addEventListener('click', () => scheduler.stop());
+  document.getElementById('slower').addEventListener('click', () => scheduler.setCps(scheduler.cps - 0.1));
+  document.getElementById('faster').addEventListener('click', () => scheduler.setCps(scheduler.cps + 0.1));
+</script>

packages/core/index.mjs

@@ -15,6 +15,8 @@ export * from './state.mjs';
 export * from './timespan.mjs';
 export * from './util.mjs';
 export * from './speak.mjs';
+export * from './clockworker.mjs';
+export * from './scheduler.mjs';
 export { default as gist } from './gist.js';
 // below won't work with runtime.mjs (json import fails)
 /* import * as p from './package.json';

packages/core/scheduler.mjs

@@ -0,0 +1,50 @@
+/*
+scheduler.mjs - <short description TODO>
+Copyright (C) 2022 Strudel contributors - see <https://github.com/tidalcycles/strudel/blob/main/packages/core/scheduler.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 { ClockWorker } from './clockworker.mjs';
+
+export class Scheduler {
+  worker;
+  pattern;
+  phase;
+  cps = 1;
+  constructor({ interval = 0.1, onTrigger, latency = 0.1 }) {
+    this.worker = new ClockWorker((_, interval) => {
+      const begin = this.phase;
+      const end = this.phase + interval * this.cps;
+      this.phase = end;
+      const haps = this.pattern.queryArc(begin, end);
+      haps.forEach((hap) => {
+        if (typeof hap.value?.cps === 'number') {
+          this.setCps(hap.value?.cps);
+        }
+        if (!hap.part.begin.equals(hap.whole.begin)) {
+          return;
+        }
+        const deadline = (hap.whole.begin - begin) / this.cps + latency;
+        // TODO: use legato / duration of objectified value
+        const duration = hap.duration / this.cps;
+        onTrigger?.(hap, deadline, duration);
+      });
+    }, interval);
+  }
+  start() {
+    if (!this.pattern) {
+      throw new Error('Scheduler: no pattern set! call .setPattern first.');
+    }
+    this.phase = 0;
+    this.worker.start();
+  }
+  stop() {
+    this.worker.stop();
+  }
+  setPattern(pat) {
+    this.pattern = pat;
+  }
+  setCps(cps = 1) {
+    this.cps = cps;
+  }
+}