2014-10-22 22:49:42 +00:00
<!DOCTYPE html>
2014-09-04 04:06:01 +00:00
< html >
< head >
2014-10-22 22:49:42 +00:00
< meta charset = "utf-8" >
2019-01-09 01:21:29 +00:00
< title > Ping Pong Delay< / title >
2014-09-06 19:35:31 +00:00
2019-01-09 01:21:29 +00:00
< meta name = "viewport" content = "width=device-width, initial-scale=1, maximum-scale=1" >
< link rel = "icon" type = "image/png" sizes = "174x174" href = "./favicon.png" >
2015-02-13 21:24:52 +00:00
2020-07-18 00:58:09 +00:00
< script src = "https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/2.4.3/webcomponents-bundle.js" > < / script >
2020-07-18 00:36:42 +00:00
< link href = "https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel = "stylesheet" / >
2019-01-09 01:21:29 +00:00
< script src = "../build/Tone.js" > < / script >
2020-07-18 00:58:09 +00:00
< script src = "./js/tone-ui.js" > < / script >
< script src = "./js/components.js" > < / script >
2014-09-04 04:06:01 +00:00
< / head >
< body >
2020-07-18 00:36:42 +00:00
< tone-example label = "Ping Pong Delay" >
2019-01-09 01:21:29 +00:00
< tone-loader > < / tone-loader >
2020-07-18 00:36:42 +00:00
< div slot = "explanation" >
2015-06-27 21:25:01 +00:00
A Ping Pong Delay is a stereo feedback delay where the delay bounces back and forth between the left and right channels. Hit the button to trigger a snare sample into the effect.
2015-06-27 22:02:55 +00:00
< br > < br >
2019-01-09 01:21:29 +00:00
< a href = "https://tonejs.github.io/docs/PingPongDelay" > Tone.PingPongDelay< / a > docs.
2020-07-18 00:36:42 +00:00
< / div >
2019-01-09 01:21:29 +00:00
2020-07-18 00:36:42 +00:00
< div id = "content" >
< tone-momentary-button > < / tone-momentary-button >
< / div >
2019-01-09 01:21:29 +00:00
< / tone-example >
< script type = "text/javascript" >
2020-07-19 00:20:19 +00:00
// the feedback delay
const feedbackDelay = new Tone.PingPongDelay({
delayTime: "8n",
feedback: 0.6,
wet: 0.5
2020-07-18 00:36:42 +00:00
}).toDestination();
2014-09-04 04:06:01 +00:00
2020-07-19 00:20:19 +00:00
// play a snare sound through it
2020-07-18 00:36:42 +00:00
const player = new Tone.Player("https://tonejs.github.io/audio/drum-samples/CR78/snare.mp3").connect(feedbackDelay);
2015-06-27 21:25:01 +00:00
2020-07-19 00:20:19 +00:00
const toneMeter = new Tone.Meter({ channels: 2 });
feedbackDelay.connect(toneMeter);
2020-07-18 00:36:42 +00:00
meter({
tone: toneMeter,
2020-07-19 00:20:19 +00:00
parent: document.querySelector("#content")
});
2020-07-18 00:36:42 +00:00
2020-07-19 00:20:19 +00:00
document.querySelector("tone-momentary-button").addEventListener("down", () => player.start());
document.querySelector("tone-momentary-button").addEventListener("up", () => player.stop());
2014-09-04 04:06:01 +00:00
< / script >
< / body >
2017-03-18 16:35:37 +00:00
< / html >