mirror of
https://codeberg.org/uzu/strudel
synced 2026-07-25 23:10:34 -04:00
copy potentially useful files from old tutorial
This commit is contained in:
Felix Roos
@@ -0,0 +1,60 @@
|
||||
import React, { Fragment } from 'react';
|
||||
import { docs } from '../../../doc.json';
|
||||
import { MiniRepl } from '../../../tutorial/MiniRepl';
|
||||
|
||||
const visible = window.location.href.includes('?api=true');
|
||||
|
||||
function ApiDoc() {
|
||||
if (!visible) {
|
||||
return (
|
||||
<p>
|
||||
There remaining function documentation is a work in progress, but you can preview it by clicking{' '}
|
||||
<a href="?api=true#everything-else">here</a>. Beware that everything is not properly ordered from this point.
|
||||
</p>
|
||||
);
|
||||
}
|
||||
// console.log('docJson', docs);
|
||||
return (
|
||||
<div>
|
||||
<p>
|
||||
The following Chapter is autogenerated from the jsdoc comments in the source files.{' '}
|
||||
<a href="?#everything-else">hide</a>. Beware that everything is not properly ordered from this point.
|
||||
</p>
|
||||
{docs
|
||||
.filter((item) => !item.name?.startsWith('_') && item.kind !== 'package')
|
||||
.map((item, i) => (
|
||||
<Fragment key={i}>
|
||||
{' '}
|
||||
<h2 id={`${item.memberof ? `${item.memberof}-` : ''}${item.name}`}>
|
||||
{item.memberof && item.memberof !== item.name ? `${item.memberof}.` : ''}
|
||||
{item.name}
|
||||
</h2>
|
||||
<div
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: item.description.replaceAll(/\{\@link ([a-zA-Z]+)?\#?([a-zA-Z]*)\}/g, (_, a, b) => {
|
||||
// console.log(_, 'a', a, 'b', b);
|
||||
return `<a href="#${a}${b ? `-${b}` : ''}">${a}${b ? `#${b}` : ''}</a>`;
|
||||
}),
|
||||
}}
|
||||
/>
|
||||
{!!item.params?.length && <h3>Parameters</h3>}
|
||||
<ul>
|
||||
{item.params?.map((param, i) => (
|
||||
<li key={i}>
|
||||
{param.name} ({param.type?.names?.join('|')}): {param.description?.replace(/(<([^>]+)>)/gi, '')}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{item.examples?.length && <h3>Examples</h3>}
|
||||
<div className="space-y-2">
|
||||
{item.examples?.map((example, k) => (
|
||||
<MiniRepl key={k} tune={example} />
|
||||
))}
|
||||
</div>
|
||||
</Fragment>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default ApiDoc;
|
||||
@@ -0,0 +1,152 @@
|
||||
# Old APIs
|
||||
|
||||
These APIs are outdated and might break in the future.
|
||||
|
||||
## Webdirt API (deprecated)
|
||||
|
||||
You can use the powerful sampling engine [Webdirt](https://github.com/dktr0/WebDirt) with Strudel.
|
||||
|
||||
{{ 'Pattern.webdirt' | jsdoc }}
|
||||
|
||||
<br />
|
||||
<br />
|
||||
|
||||
## Tone API (deprecated)
|
||||
|
||||
The Tone API uses Tone.js instruments ands effects to create sounds.
|
||||
|
||||
<MiniRepl
|
||||
tune={`stack(
|
||||
"[c5 c5 bb4 c5] [~ g4 ~ g4] [c5 f5 e5 c5] ~"
|
||||
.tone(synth(adsr(0,.1,0,0)).chain(out())),
|
||||
"[c2 c3]*8"
|
||||
.tone(synth({
|
||||
...osc('sawtooth'),
|
||||
...adsr(0,.1,0.4,0)
|
||||
}).chain(lowpass(300), out()))
|
||||
).slow(4)`}
|
||||
/>
|
||||
|
||||
### tone(instrument)
|
||||
|
||||
To change the instrument of a pattern, you can pass any [Tone.js Source](https://tonejs.github.io/docs/14.7.77/index.html) to .tone:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(new FMSynth().toDestination())`}
|
||||
/>
|
||||
|
||||
While this works, it is a little bit verbose. To simplify things, all Tone Synths have a shortcut:
|
||||
|
||||
```js
|
||||
const amsynth = (options) => new AMSynth(options);
|
||||
const duosynth = (options) => new DuoSynth(options);
|
||||
const fmsynth = (options) => new FMSynth(options);
|
||||
const membrane = (options) => new MembraneSynth(options);
|
||||
const metal = (options) => new MetalSynth(options);
|
||||
const monosynth = (options) => new MonoSynth(options);
|
||||
const noise = (options) => new NoiseSynth(options);
|
||||
const pluck = (options) => new PluckSynth(options);
|
||||
const polysynth = (options) => new PolySynth(options);
|
||||
const synth = (options) => new Synth(options);
|
||||
const sampler = (options, baseUrl?) => new Sampler(options); // promisified, see below
|
||||
const players = (options, baseUrl?) => new Sampler(options); // promisified, see below
|
||||
```
|
||||
|
||||
### sampler
|
||||
|
||||
With sampler, you can create tonal instruments from samples:
|
||||
|
||||
<MiniRepl
|
||||
tune={`sampler({
|
||||
C5: 'https://freesound.org/data/previews/536/536549_11935698-lq.mp3'
|
||||
}).then(kalimba =>
|
||||
saw.struct("x*8").mul(16).round()
|
||||
.legato(4).scale('D dorian').slow(2)
|
||||
.tone(kalimba.toDestination())
|
||||
)`}
|
||||
/>
|
||||
|
||||
The sampler function promisifies [Tone.js Sampler](https://tonejs.github.io/docs/14.7.77/Sampler).
|
||||
|
||||
Note that this function currently only works with this promise notation, but in the future,
|
||||
it will be possible to use async instruments in a synchronous fashion.
|
||||
|
||||
### players
|
||||
|
||||
With players, you can create sound banks:
|
||||
|
||||
<MiniRepl
|
||||
tune={`players({
|
||||
bd: 'samples/tidal/bd/BT0A0D0.wav',
|
||||
sn: 'samples/tidal/sn/ST0T0S3.wav',
|
||||
hh: 'samples/tidal/hh/000_hh3closedhh.wav'
|
||||
}, 'https://loophole-letters.vercel.app/')
|
||||
.then(drums=>
|
||||
"bd hh sn hh".tone(drums.toDestination())
|
||||
)
|
||||
`}
|
||||
/>
|
||||
|
||||
The sampler function promisifies [Tone.js Players](https://tonejs.github.io/docs/14.7.77/Players).
|
||||
|
||||
Note that this function currently only works with this promise notation, but in the future,
|
||||
it will be possible to use async instruments in a synchronous fashion.
|
||||
|
||||
### out
|
||||
|
||||
Shortcut for Tone.Destination. Intended to be used with Tone's .chain:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(membrane().chain(out()))`}
|
||||
/>
|
||||
|
||||
This alone is not really useful, so read on..
|
||||
|
||||
### vol(volume)
|
||||
|
||||
Helper that returns a Gain Node with the given volume. Intended to be used with Tone's .chain:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(noise().chain(vol(0.5), out()))`}
|
||||
/>
|
||||
|
||||
### osc(type)
|
||||
|
||||
Helper to set the waveform of a synth, monosynth or polysynth:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(synth(osc('sawtooth4')).chain(out()))`}
|
||||
/>
|
||||
|
||||
The base types are `sine`, `square`, `sawtooth`, `triangle`. You can also append a number between 1 and 32 to reduce the harmonic partials.
|
||||
|
||||
### lowpass(cutoff)
|
||||
|
||||
Helper that returns a Filter Node of type lowpass with the given cutoff. Intended to be used with Tone's .chain:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(synth(osc('sawtooth')).chain(lowpass(800), out()))`}
|
||||
/>
|
||||
|
||||
### highpass(cutoff)
|
||||
|
||||
Helper that returns a Filter Node of type highpass with the given cutoff. Intended to be used with Tone's .chain:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(synth(osc('sawtooth')).chain(highpass(2000), out()))`}
|
||||
/>
|
||||
|
||||
### adsr
|
||||
|
||||
Helper to set the envelope of a Tone.js instrument. Intended to be used with Tone's .set:
|
||||
|
||||
<MiniRepl
|
||||
tune={`"[c4 c4 bb3 c4] [~ g3 ~ g3] [c4 f4 e4 c4] ~".slow(4)
|
||||
.tone(synth(adsr(0,.1,0,0)).chain(out()))`}
|
||||
/>
|
||||
Reference in New Issue
Block a user