Merge pull request #878 from tidalcycles/move-examples

move all examples to separate examples folder
This commit is contained in:
Felix Roos 2023-12-29 16:53:39 +01:00 committed by GitHub
commit bd2333377f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
44 changed files with 166 additions and 269 deletions

3
examples/README.md Normal file
View File

@ -0,0 +1,3 @@
# examples
This folder contains usage examples for different scenarios.

View File

@ -0,0 +1,5 @@
# buildless examples
These examples show you how strudel can be used in a regular html file, without the need for a build tool.
Most examples are using [skypack](https://www.skypack.dev/)

View File

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

View File

@ -0,0 +1,8 @@
# codemirror-repl example
This folder demonstrates how to set up a full strudel repl with the `@strudel/codemirror` package. Run it using:
```sh
pnpm i
pnpm dev
```

View File

@ -0,0 +1,13 @@
# headless-repl demo
This demo shows how to use strudel in "headless mode".
Buttons A / B / C will switch between different patterns.
It showcases the usage of the `@strudel/web` package, using [vite](https://vitejs.dev/) as the dev server.
## Running
```sh
pnpm i && cd examples/headless-repl
pnpm dev
# open http://localhost:5173/
```

1
examples/minimal-repl/.gitignore vendored Normal file
View File

@ -0,0 +1 @@
dist

View File

@ -0,0 +1,10 @@
# minimal repl
This folder demonstrates how to set up a minimal strudel repl using vite and vanilla JS. Run it using:
```sh
npm i
npm run dev
```
If you're looking for a more feature rich alternative, have a look at the [../codemirror-repl](codemirror-repl example)

View File

@ -0,0 +1,13 @@
# superdough demo
This demo shows how to use strudel in "headless mode".
Buttons A / B / C will switch between different patterns.
It showcases the usage of the `@strudel/web` package, using [vite](https://vitejs.dev/) as the dev server.
## Running
```sh
pnpm i && cd examples/headless-repl
pnpm dev
# open http://localhost:5173/
```

View File

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<title>Superdough Example</title>
<meta charset="UTF-8" />
</head>
<body>
<button id="play">PLAAAAAAAY</button>
<script type="module">
import { superdough, samples, initAudioOnFirstClick, registerSynthSounds } from 'superdough';
const init = Promise.all([
initAudioOnFirstClick(),
samples('github:tidalcycles/Dirt-Samples/master'),
registerSynthSounds(),
]);
const loop = (t = 0) => {
// superdough(value, time, duration)
superdough({ s: 'bd', delay: 0.5 }, t);
superdough({ note: 'g1', s: 'sawtooth', cutoff: 600, resonance: 8 }, t, 0.125);
superdough({ note: 'g2', s: 'sawtooth', cutoff: 600, resonance: 8 }, t + 0.25, 0.125);
superdough({ s: 'hh' }, t + 0.25);
superdough({ s: 'sd', room: 0.5 }, t + 0.5);
superdough({ s: 'hh' }, t + 0.75);
};
document.getElementById('play').addEventListener('click', async () => {
await init;
let t = 0.1;
while (t < 16) {
loop(t++);
}
});
</script>
</body>
</html>

View File

@ -1,8 +0,0 @@
# vite-vanilla-repl-cm6
This folder demonstrates how to set up a strudel repl using vite and vanilla JS + codemirror. Run it using:
```sh
pnpm i
pnpm dev
```

View File

@ -1 +0,0 @@
!dist

View File

@ -1,8 +0,0 @@
# vite-vanilla-repl
This folder demonstrates how to set up a strudel repl using vite and vanilla JS. Run it using:
```sh
npm i
npm run dev
```

View File

@ -1 +0,0 @@
import{b as s,h as i,m,a as n,c as p,p as t}from"./index.4cbc0a10.js";export{s as SyntaxError,i as h,m as mini,n as minify,p as parse,t as patternifyAST};

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +0,0 @@
import{g as s,f as d,i as t,n as r,l as u,j as o,d as f,k as p,r as g,s as i,w as l,e as m}from"./index.4cbc0a10.js";export{s as getAudioContext,d as getCachedBuffer,t as getLoadedBuffer,r as getLoadedSamples,u as loadBuffer,o as loadGithubSamples,f as panic,p as resetLoadedSamples,g as reverseBuffer,i as samples,l as webaudioOutput,m as webaudioOutputTrigger};

View File

@ -1,36 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite Vanilla Strudel REPL</title>
<script type="module" crossorigin src="/tidalcycles/strudel/use-acorn/packages/core/examples/vite-vanilla-repl/dist/assets/index.4cbc0a10.js"></script>
</head>
<body style="margin: 0; background: #222">
<div style="display: grid; height: 100vh">
<textarea
id="text"
style="font-size: 2em; border: 0; color: white; background: transparent; outline: none; padding: 20px"
spellcheck="false"
></textarea>
</div>
<button
id="start"
style="
position: absolute;
border-radius: 10px;
top: 20px;
right: 20px;
padding: 20px;
border: 2px solid white;
background: transparent;
color: white;
cursor: pointer;
"
>
evaluate
</button>
<div id="output"></div>
</body>
</html>

View File

@ -1,12 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Superdough Example</title>
<meta charset="UTF-8" />
</head>
<body>
<button id="play">PLAAAAAAAY</button>
<script src="/main.js" type="module"></script>
</body>
</html>

View File

@ -1,25 +0,0 @@
import { superdough, samples, initAudioOnFirstClick, registerSynthSounds } from 'superdough';
const init = Promise.all([
initAudioOnFirstClick(),
samples('github:tidalcycles/Dirt-Samples/master'),
registerSynthSounds(),
]);
const loop = (t = 0) => {
// superdough(value, time, duration)
superdough({ s: 'bd', delay: 0.5 }, t);
superdough({ note: 'g1', s: 'sawtooth', cutoff: 600, resonance: 8 }, t, 0.125);
superdough({ note: 'g2', s: 'sawtooth', cutoff: 600, resonance: 8 }, t + 0.25, 0.125);
superdough({ s: 'hh' }, t + 0.25);
superdough({ s: 'sd', room: 0.5 }, t + 0.5);
superdough({ s: 'hh' }, t + 0.75);
};
document.getElementById('play').addEventListener('click', async () => {
await init;
let t = 0.1;
while (t < 16) {
loop(t++);
}
});

View File

@ -1,10 +0,0 @@
<!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';
initStrudel();
document.getElementById('play').addEventListener('click', () => note('<c a f e>(3,8)').play());
document.getElementById('stop').addEventListener('click', () => hush());
</script>

View File

@ -1,12 +0,0 @@
<!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';
initStrudel({
prebake: () => samples('github:tidalcycles/Dirt-Samples/master'),
});
document.getElementById('play').addEventListener('click', () => s('[bd sd](3,8)').play());
document.getElementById('stop').addEventListener('click', () => hush());
</script>

196
pnpm-lock.yaml generated
View File

@ -73,6 +73,76 @@ importers:
specifier: ^0.33.0
version: 0.33.0(@vitest/ui@0.28.0)
examples/codemirror-repl:
dependencies:
'@strudel.cycles/core':
specifier: workspace:*
version: link:../../packages/core
'@strudel.cycles/mini':
specifier: workspace:*
version: link:../../packages/mini
'@strudel.cycles/soundfonts':
specifier: workspace:*
version: link:../../packages/soundfonts
'@strudel.cycles/tonal':
specifier: workspace:*
version: link:../../packages/tonal
'@strudel.cycles/transpiler':
specifier: workspace:*
version: link:../../packages/transpiler
'@strudel.cycles/webaudio':
specifier: workspace:*
version: link:../../packages/webaudio
'@strudel/codemirror':
specifier: workspace:*
version: link:../../packages/codemirror
devDependencies:
vite:
specifier: ^4.3.2
version: 4.5.0(@types/node@18.16.3)
examples/headless-repl:
dependencies:
'@strudel/web':
specifier: workspace:*
version: link:../../packages/web
devDependencies:
vite:
specifier: ^4.3.2
version: 4.5.0(@types/node@18.16.3)
examples/minimal-repl:
dependencies:
'@strudel.cycles/core':
specifier: workspace:*
version: link:../../packages/core
'@strudel.cycles/mini':
specifier: workspace:*
version: link:../../packages/mini
'@strudel.cycles/tonal':
specifier: workspace:*
version: link:../../packages/tonal
'@strudel.cycles/transpiler':
specifier: workspace:*
version: link:../../packages/transpiler
'@strudel.cycles/webaudio':
specifier: workspace:*
version: link:../../packages/webaudio
devDependencies:
vite:
specifier: ^4.3.3
version: 4.5.0(@types/node@18.16.3)
examples/superdough:
dependencies:
superdough:
specifier: workspace:*
version: link:../../packages/superdough
devDependencies:
vite:
specifier: ^4.4.5
version: 4.5.0(@types/node@18.16.3)
packages/codemirror:
dependencies:
'@codemirror/autocomplete':
@ -141,56 +211,6 @@ importers:
specifier: ^0.33.0
version: 0.33.0(@vitest/ui@0.28.0)
packages/core/examples/vite-vanilla-repl:
dependencies:
'@strudel.cycles/core':
specifier: workspace:*
version: link:../..
'@strudel.cycles/mini':
specifier: workspace:*
version: link:../../../mini
'@strudel.cycles/tonal':
specifier: workspace:*
version: link:../../../tonal
'@strudel.cycles/transpiler':
specifier: workspace:*
version: link:../../../transpiler
'@strudel.cycles/webaudio':
specifier: workspace:*
version: link:../../../webaudio
devDependencies:
vite:
specifier: ^4.3.3
version: 4.3.3
packages/core/examples/vite-vanilla-repl-cm6:
dependencies:
'@strudel.cycles/core':
specifier: workspace:*
version: link:../..
'@strudel.cycles/mini':
specifier: workspace:*
version: link:../../../mini
'@strudel.cycles/soundfonts':
specifier: workspace:*
version: link:../../../soundfonts
'@strudel.cycles/tonal':
specifier: workspace:*
version: link:../../../tonal
'@strudel.cycles/transpiler':
specifier: workspace:*
version: link:../../../transpiler
'@strudel.cycles/webaudio':
specifier: workspace:*
version: link:../../../webaudio
'@strudel/codemirror':
specifier: workspace:*
version: link:../../../codemirror
devDependencies:
vite:
specifier: ^4.3.2
version: 4.3.3
packages/csound:
dependencies:
'@csound/browser':
@ -320,7 +340,7 @@ importers:
devDependencies:
vite:
specifier: ^4.3.3
version: 4.5.0
version: 4.5.0(@types/node@18.16.3)
packages/serial:
dependencies:
@ -364,16 +384,6 @@ importers:
specifier: ^4.3.3
version: 4.3.3
packages/superdough/example:
dependencies:
superdough:
specifier: workspace:*
version: link:..
devDependencies:
vite:
specifier: ^4.4.5
version: 4.4.5(@types/node@18.16.3)
packages/tonal:
dependencies:
'@strudel.cycles/core':
@ -443,16 +453,6 @@ importers:
specifier: ^4.3.3
version: 4.3.3
packages/web/examples/repl-example:
dependencies:
'@strudel/web':
specifier: workspace:*
version: link:../..
devDependencies:
vite:
specifier: ^4.3.2
version: 4.3.3
packages/webaudio:
dependencies:
'@strudel.cycles/core':
@ -10201,12 +10201,6 @@ packages:
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
hasBin: true
/nanoid@3.3.7:
resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
hasBin: true
dev: true
/nanoid@4.0.2:
resolution: {integrity: sha512-7ZtY5KTCNheRGfEFxnedV5zFiORN1+Y1N6zvPTnHQd8ENUvfaDBeuJDZb2bN/oXwXxu3qkTXDzy57W5vAmDTBw==}
engines: {node: ^14 || ^16 || >=18}
@ -11355,7 +11349,6 @@ packages:
nanoid: 3.3.6
picocolors: 1.0.0
source-map-js: 1.0.2
dev: true
/postcss@8.4.31:
resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==}
@ -11364,15 +11357,7 @@ packages:
nanoid: 3.3.6
picocolors: 1.0.0
source-map-js: 1.0.2
/postcss@8.4.32:
resolution: {integrity: sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==}
engines: {node: ^10 || ^12 || >=14}
dependencies:
nanoid: 3.3.7
picocolors: 1.0.0
source-map-js: 1.0.2
dev: true
dev: false
/prebuild-install@7.1.1:
resolution: {integrity: sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==}
@ -13807,41 +13792,6 @@ packages:
fsevents: 2.3.3
dev: true
/vite@4.5.0:
resolution: {integrity: sha512-ulr8rNLA6rkyFAlVWw2q5YJ91v098AFQ2R0PRFwPzREXOUJQPtFUG0t+/ZikhaOCDqFoDhN6/v8Sq0o4araFAw==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
peerDependencies:
'@types/node': '>= 14'
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.18.20
postcss: 8.4.32
rollup: 3.28.0
optionalDependencies:
fsevents: 2.3.3
dev: true
/vite@4.5.0(@types/node@18.16.3):
resolution: {integrity: sha512-ulr8rNLA6rkyFAlVWw2q5YJ91v098AFQ2R0PRFwPzREXOUJQPtFUG0t+/ZikhaOCDqFoDhN6/v8Sq0o4araFAw==}
engines: {node: ^14.18.0 || >=16.0.0}
@ -13872,7 +13822,7 @@ packages:
dependencies:
'@types/node': 18.16.3
esbuild: 0.18.20
postcss: 8.4.31
postcss: 8.4.27
rollup: 3.28.0
optionalDependencies:
fsevents: 2.3.3

View File

@ -1,8 +1,5 @@
packages:
# all packages in direct subdirs of packages/
- "packages/*"
- "examples/*"
- "website/"
- "packages/core/examples/vite-vanilla-repl"
- "packages/core/examples/vite-vanilla-repl-cm6"
- "packages/web/examples/repl-example"
- "packages/superdough/example"