Merge branch 'main' into multichannel_audio

website/src/docs/JsDoc.jsx

@@ -2,19 +2,15 @@ import jsdoc from '../../../doc.json'; // doc.json is built with `npm run jsdoc-
 const docs = jsdoc.docs.reduce((acc, obj) => Object.assign(acc, { [obj.longname]: obj }), {});
 import { MiniRepl } from './MiniRepl';
 
-const getTag = (title, item) => item.tags?.find((t) => t.title === title)?.text;
-
 export function JsDoc({ name, h = 3, hideDescription, punchcard, canvasHeight }) {
   const item = docs[name];
   if (!item) {
     console.warn('Not found: ' + name);
     return <div />;
   }
-  const synonyms = getTag('synonyms', item)?.split(', ') || [];
   const CustomHeading = `h${h}`;
   const description =
     item.description?.replaceAll(/\{@link ([a-zA-Z\.]+)?#?([a-zA-Z]*)\}/g, (_, a, b) => {
-      // console.log(_, 'a', a, 'b', b);
       return `<a href="#${a.replaceAll('.', '').toLowerCase()}${b ? `-${b}` : ''}">${a}${b ? `#${b}` : ''}</a>`;
     }) || '';
   return (
@@ -22,9 +18,9 @@ export function JsDoc({ name, h = 3, hideDescription, punchcard, canvasHeight })
       {!!h && <CustomHeading>{item.longname}</CustomHeading>}
       {!hideDescription && (
         <>
-          {!!synonyms.length && (
+          {!!item.synonyms_text && (
             <span>
-              Synonyms: <code>{synonyms.join(', ')}</code>
+              Synonyms: <code>{item.synonyms_text}</code>
             </span>
           )}
           <div dangerouslySetInnerHTML={{ __html: description }} />

website/src/pages/learn/hydra.mdx

@@ -41,6 +41,8 @@ note("[a,c,e,<a4 ab4 g4 gb4>,b4]/4").s("sawtooth").vib(2)
 `}
 />
 
+## H patterns
+
 There is a special function `H` that allows you to use a pattern as an input to hydra:
 
 <MiniRepl
@@ -48,8 +50,50 @@ There is a special function `H` that allows you to use a pattern as an input to
   tune={`await initHydra()
 let pattern = "3 4 5 [6 7]*2"
 shape(H(pattern)).out(o0)
-n(pattern).scale("A:minor").piano().room(1) 
+n(pattern).scale("A:minor").piano().room(1)
+`}
+/>
+
+## detectAudio
+
+To use hydra audio capture, call `initHydra` with `{detectAudio:true}` configuration param:
+
+<MiniRepl
+  client:only="react"
+  tune={`await initHydra({detectAudio:true})
+let pattern = "<3 4 5 [6 7]*2>"
+shape(H(pattern)).repeat()
+  .scrollY(
+    ()=> a.fft[0]*.25
+  )
+  .add(src(o0).color(.71 ).scrollX(.005),.95)
+.out(o0)
+n(pattern).scale("A:minor").piano().room(1)
 `}
 />
 
 You might now be able to see this properly here: [open in REPL](/#YXdhaXQgaW5pdEh5ZHJhKCkKbGV0IHBhdHRlcm4gPSAiMyA0IDUgWzYgN10qMiIKc2hhcGUoSChwYXR0ZXJuKSkub3V0KG8wKQpuKHBhdHRlcm4pLnNjYWxlKCJBOm1pbm9yIikucGlhbm8oKS5yb29tKDEpIA%3D%3D)
+
+Similar to `detectAudio`, all the [available hydra options](https://github.com/hydra-synth/hydra-synth#api) can be passed to `initHydra`.
+
+## feedStrudel
+
+Using the `feedStrudel` option, you can transform strudel visualizations with hydra:
+
+<MiniRepl
+  client:only="react"
+  tune={`await initHydra({feedStrudel:1})
+//
+src(s0).kaleid(H("<4 5 6>"))
+  .diff(osc(1,0.5,5))
+  .modulateScale(osc(2,-0.25,1))
+  .out()
+//
+stack(
+  s("bd*2,[hh:0:<.5 1>]*4,~ rim").bank("RolandTR909").speed(.9),
+  note("[<g1!3 <bb1 <f1 d1>>>]*3").s("sawtooth")
+  .room(.75).sometimes(add(note(12))).clip(.3)
+  .lpa(.05).lpenv(-4).lpf(2000).lpq(8).ftype('24db')
+).fft(4)
+  .scope({pos:0,smear:.95})`}
+/>

website/src/pages/learn/synths.mdx

@@ -42,6 +42,10 @@ Some amount of pink noise can also be added to any oscillator by using the `nois
 
 <MiniRepl client:idle tune={`note("c3").noise("<0.1 0.25 0.5>").scope()`} />
 
+You can also use the `crackle` type to play some subtle noise crackles. You can control noise amount by using the `density` parameter:
+
+<MiniRepl client:idle tune={`s("crackle*4").density("<0.01 0.04 0.2 0.5>".slow(4)).scope()`} />
+
 ### Additive Synthesis
 
 To tame the harsh sound of the basic waveforms, we can set the `n` control to limit the overtones of the waveform:

website/src/repl/Reference.jsx

@@ -37,6 +37,11 @@ export function Reference() {
           {visibleFunctions.map((entry, i) => (
             <section key={i}>
               <h3 id={`doc-${i}`}>{entry.name}</h3>
+              {!!entry.synonyms_text && (
+                <p>
+                  Synonyms: <code>{entry.synonyms_text}</code>
+                </p>
+              )}
               {/* <small>{entry.meta.filename}</small> */}
               <p dangerouslySetInnerHTML={{ __html: entry.description }}></p>
               <ul>