fix: repl package init audio properly

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

@@ -1,4 +1,5 @@
-<script src="https://unpkg.com/@strudel/repl@1.0.2"></script>
+<script src="https://unpkg.com/@strudel/repl@1.2.7"></script>
+<!-- <script src="../../packages/repl/dist/index.js"></script> -->
 <strudel-editor>
   <!--
 // @date 23-08-15

packages/codemirror/keybindings.mjs

@@ -1,5 +1,5 @@
 import { defaultKeymap } from '@codemirror/commands';
-import { Prec, EditorState } from '@codemirror/state';
+import { Prec } from '@codemirror/state';
 import { keymap, ViewPlugin } from '@codemirror/view';
 // import { searchKeymap } from '@codemirror/search';
 import { emacs } from '@replit/codemirror-emacs';
@@ -133,9 +133,5 @@ const keymaps = {
 
 export function keybindings(name) {
   const active = keymaps[name];
-  const extensions = active ? [Prec.high(active())] : [];
-  if (name === 'vim') {
-    extensions.push(EditorState.allowMultipleSelections.of(true));
-  }
-  return extensions;
+  return [active ? Prec.high(active()) : []];
 }

packages/repl/repl-component.mjs

@@ -1,11 +1,12 @@
 import { silence } from '@strudel/core';
 import { getDrawContext } from '@strudel/draw';
 import { transpiler } from '@strudel/transpiler';
-import { getAudioContext, webaudioOutput } from '@strudel/webaudio';
+import { getAudioContext, webaudioOutput, initAudioOnFirstClick } from '@strudel/webaudio';
 import { StrudelMirror, codemirrorSettings } from '@strudel/codemirror';
 import { prebake } from './prebake.mjs';
 
 if (typeof HTMLElement !== 'undefined') {
+  initAudioOnFirstClick();
   class StrudelRepl extends HTMLElement {
     static observedAttributes = ['code'];
     settings = codemirrorSettings.get();

packages/superdough/helpers.mjs

@@ -42,7 +42,6 @@ export const getParamADSR = (
   decay,
   sustain,
   release,
-  // min = value at start of attack, max = value at end of attack; it is possible that max < min
   min,
   max,
   begin,
@@ -60,15 +59,17 @@ export const getParamADSR = (
     max = max === 0 ? 0.001 : max;
   }
   const range = max - min;
+  const peak = max;
   const sustainVal = min + sustain * range;
   const duration = end - begin;
 
   const envValAtTime = (time) => {
     let val;
     if (attack > time) {
-      val = time * getSlope(min, max, 0, attack) + min;
+      let slope = getSlope(min, peak, 0, attack);
+      val = time * slope + (min > peak ? min : 0);
     } else {
-      val = (time - attack) * getSlope(max, sustainVal, 0, decay) + max;
+      val = (time - attack) * getSlope(peak, sustainVal, 0, decay) + peak;
     }
     if (curve === 'exponential') {
       val = val || 0.001;

pnpm-lock.yaml

@@ -804,9 +804,6 @@ importers:
       astro:
         specifier: ^5.1.9
         version: 5.1.9(@types/node@22.10.10)(jiti@2.4.2)(lightningcss@1.29.1)(rollup@2.79.2)(terser@5.37.0)(typescript@5.7.3)(yaml@2.7.0)
-      base64url-universal:
-        specifier: ^2.0.0
-        version: 2.0.0
       claviature:
         specifier: ^0.1.0
         version: 0.1.0
@@ -3300,14 +3297,6 @@ packages:
   base64-js@1.5.1:
     resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
 
-  base64url-universal@2.0.0:
-    resolution: {integrity: sha512-6Hpg7EBf3t148C3+fMzjf+CHnADVDafWzlJUXAqqqbm4MKNXbsoPdOkWeRTjNlkYG7TpyjIpRO1Gk0SnsFD1rw==}
-    engines: {node: '>=14'}
-
-  base64url@3.0.1:
-    resolution: {integrity: sha512-ir1UPr3dkwexU7FdV8qBBbNDRUhMmIekYMFZfi+C/sLNnRESKPl23nB9b2pltqfOQNnGzsDdId90AEtG5tCx4A==}
-    engines: {node: '>=6.0.0'}
-
   before-after-hook@2.2.3:
     resolution: {integrity: sha512-NzUnlZexiaH/46WDhANlyR2bXRopNg4F/zuSA3OpZnllCUgRaOF2znDioDWrmbNVsuZk6l9pMquQB38cfBZwkQ==}
 
@@ -11019,12 +11008,6 @@ snapshots:
 
   base64-js@1.5.1: {}
 
-  base64url-universal@2.0.0:
-    dependencies:
-      base64url: 3.0.1
-
-  base64url@3.0.1: {}
-
   before-after-hook@2.2.3: {}
 
   bin-links@4.0.4:
@@ -12995,7 +12978,7 @@ snapshots:
   jake@10.9.2:
     dependencies:
       async: 3.2.6
-      chalk: 4.1.2
+      chalk: 4.1.0
       filelist: 1.0.4
       minimatch: 3.1.2
 

website/package.json

@@ -53,7 +53,6 @@
     "@types/react": "^19.0.8",
     "@types/react-dom": "^19.0.3",
     "astro": "^5.1.9",
-    "base64url-universal": "^2.0.0",
     "claviature": "^0.1.0",
     "date-fns": "^4.1.0",
     "hs2js": "0.1.0",

website/src/pages/learn/mini-notation.mdx

@@ -142,8 +142,6 @@ The "~" represents a rest, and will create silence between other events:
 
 <MiniRepl client:idle tune={`note("[b4 [~ c5] d5 e5]")`} punchcard />
 
-Alternatively, "-" can be used instead of "~". It means the same thing.
-
 ## Parallel / polyphony
 
 Using commas, we can play chords.

website/src/repl/useReplContext.jsx

@@ -38,7 +38,6 @@ import { getRandomTune, initCode, loadModules, shareCode } from './util.mjs';
 import './Repl.css';
 import { setInterval, clearInterval } from 'worker-timers';
 import { getMetadata } from '../metadata_parser';
-import { encode as base64urlencode } from 'base64url-universal';
 import { debugAudiograph } from './audiograph';
 
 const { latestCode, maxPolyphony, audioDeviceName, multiChannelOrbits } = settingsMap.get();
@@ -102,29 +101,13 @@ export function useReplContext() {
         }
       },
       beforeEval: () => audioReady,
-      afterEval: async (all) => {
+      afterEval: (all) => {
         const { code } = all;
         //post to iframe parent (like Udels) if it exists...
         window.parent?.postMessage(code);
 
         setLatestCode(code);
-        //window.location.hash = '#' + code2hash(code);
-
-        // Compress the script and encode it with base64url
-        const encoded = new TextEncoder().encode(code);
-        //console.log('encoded',encoded);
-
-        const cs = new CompressionStream('deflate');
-        const writer = cs.writable.getWriter();
-        writer.write(encoded);
-        writer.close();
-        const compressed = new Uint8Array(await new Response(cs.readable).arrayBuffer());
-        //console.log('compressed',compressed);
-
-        const baseurled = base64urlencode(compressed);
-        //console.log('baseurled',baseurled);
-        window.location.hash = '#~' + baseurled;
-
+        window.location.hash = '#' + code2hash(code);
         setDocumentTitle(code);
         const viewingPatternData = getViewingPatternData();
         setVersionDefaultsFrom(code);

website/src/repl/util.mjs

@@ -7,7 +7,6 @@ import './Repl.css';
 import { createClient } from '@supabase/supabase-js';
 import { writeText } from '@tauri-apps/plugin-clipboard-manager';
 import { $featuredPatterns /* , loadDBPatterns */ } from '@src/user_pattern_utils.mjs';
-import { decode as base64urldecode } from 'base64url-universal';
 
 // Create a single supabase client for interacting with your database
 export const supabase = createClient(
@@ -27,38 +26,6 @@ export async function initCode() {
     const hash = initialUrl.split('?')[1]?.split('#')?.[0]?.split('&')[0];
     const codeParam = window.location.href.split('#')[1] || '';
     if (codeParam) {
-      if (codeParam[0] === '~') {
-        // Encoded using base64url and compressed
-        const baseurled = codeParam.substring(1);
-        //console.log('baseurled', baseurled);
-        const compressed = base64urldecode(baseurled);
-        //console.log('compressed', compressed);
-
-        const cs = new DecompressionStream('deflate');
-        const writer = cs.writable.getWriter();
-        writer.write(compressed);
-        writer.close();
-        const encoded = await new Response(cs.readable).arrayBuffer();
-        //console.log('encoded', encoded);
-
-        const decoded = new TextDecoder().decode(encoded);
-        //console.log('decoded', decoded);
-        return decoded;
-      }
-      if (codeParam[0] === '_') {
-        const url = decodeURIComponent(codeParam.substring(1));
-        try {
-          const response = await fetch(url);
-          if (!response.ok) {
-            throw new Error(`Response status: ${response.status}`);
-          }
-          console.log('Response', response);
-          return await response.text();
-        } catch (error) {
-          return `/* ERROR LOADING SCRIPT. ${error.message} */`;
-        }
-      }
-
       // looking like https://strudel.cc/#ImMzIGUzIg%3D%3D (hash length depends on code length)
       return hash2code(codeParam);
     } else if (hash) {