elias/strudel-docker
1
0
Fork 0
mirror of https://github.com/eliasstepanik/strudel-docker.git synced 2026-01-25 12:38:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

add without-audio example

Browse Source
This commit is contained in:
Felix Roos 2022-11-24 20:13:54 +01:00
parent e1a532500e
commit f9bf2122b7
1 changed files with 73 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
packages/core/examples/without-audio.html Normal file
View File

@ -0,0 +1,73 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Buildless Vanilla Strudel REPL</title>
</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"
>
// LOADING</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>
<script type="module">
import { controls, repl, evalScope } from 'https://cdn.skypack.dev/@strudel.cycles/core@0.4.1';
import { transpiler } from 'https://cdn.skypack.dev/@strudel.cycles/transpiler@0.4.1';
const modules = [
import('https://cdn.skypack.dev/@strudel.cycles/core@0.4.1'),
import('https://cdn.skypack.dev/@strudel.cycles/mini@0.4.1'),
];
const input = document.getElementById('text');
Promise.all(modules).then(() => {
input.innerHTML = getTune();
});
evalScope(controls, ...modules);
const { evaluate } = repl({
defaultOutput: (...args) => {
console.log(args);
},
getTime: () => Date.now() / 1000,
transpiler,
beforeEval: (code) => console.log('evaluate', code),
afterEval: (code) => {},
});
document.getElementById('start').addEventListener('click', () => {
evaluate(input.value);
});
function getTune() {
return `const output = (deadline, hap, now) => {
const { whole: { begin, end }, value } = hap;
console.log(deadline, begin+0, end+0, value);
}
note("<c3 [d3 e3]>").cutoff(1000).onTrigger(output)`;
}
</script>
</body>
</html>