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

codeformat

Browse Source
This commit is contained in:
Jack Armitage 2022-12-26 11:30:01 +00:00
parent 858f4f74b3
commit 51a4c4d13b
8 changed files with 60 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
website/src/pages/learn/code.mdx
View File

@ -9,7 +9,7 @@ import { JsDoc } from '../../docs/JsDoc';
# Strudel Code
Now that we have played some notes using different sounds, let's take a step back and look how we actually achieved this using _code_.
Now that we have played some notes using different sounds, let's take a step back and look how we actually achieved this using _code_.
Let's look at this simple example again. What do we notice?
@ -43,7 +43,7 @@ So far, we've seen the following syntax:
xxx("foo").yyy("bar")
```
Generally, `xxx` and `yyy` are called [_functions_](https://en.wikipedia.org/wiki/Function_(computer_programming)), while `foo` and `bar` are called function [_arguments_ or _parameters_](https://en.wikipedia.org/wiki/Parameter_(computer_programming)).
Generally, `xxx` and `yyy` are called [_functions_](<https://en.wikipedia.org/wiki/Function_(computer_programming)>), while `foo` and `bar` are called function [_arguments_ or _parameters_](<https://en.wikipedia.org/wiki/Parameter_(computer_programming)>).
So far, we've used the functions to declare which aspect of the sound we want to control, and their arguments for the actual data.
The `yyy` function is called a [_chained_ function](https://en.wikipedia.org/wiki/Method_chaining), because it is appended with a dot (`.`).
@ -52,7 +52,8 @@ You can think of this as being similar to chaining audio effects together using
Strudel makes heavy use of chained functions. Here is a more sophisticated example:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`note("a3 c#4 e4 a4")
.s("sawtooth")
.cutoff(500)
@ -63,14 +64,14 @@ Strudel makes heavy use of chained functions. Here is a more sophisticated examp
# Comments
The `//` in the example above is a line comment, resulting in the `delay` function being ignored.
It is a handy way to quickly turn code on and off.
It is a handy way to quickly turn code on and off.
Try uncommenting this line by deleting `//` and refreshing the pattern.
You can also use the keyboard shortcut `cmd-/` to toggle comments on and off.
# Strings
Ok, so what about the content inside the quotes (e.g. `"a3 c#4 e4 a4"`)?
In JavaScript, as in most programming languages, this content is referred to as being a [_string_](https://en.wikipedia.org/wiki/String_(computer_science)).
Ok, so what about the content inside the quotes (e.g. `"a3 c#4 e4 a4"`)?
In JavaScript, as in most programming languages, this content is referred to as being a [_string_](<https://en.wikipedia.org/wiki/String_(computer_science)>).
A string is simply a sequence of individual characters.
In TidalCycles, strings are used to write _patterns_ using the mini-notation, and you may hear the phrase _pattern string_ from time to time.
@ -78,4 +79,4 @@ The good news is, that this covers 99% of the JavaScript syntax needed for Strud
Let's now look at the way we can express [Rhythms](/learn/mini-notation)...
<br/>
<br />

9
website/src/pages/learn/getting-started.mdx
View File

@ -11,7 +11,6 @@ import { JsDoc } from '../../docs/JsDoc';
Welcome to the Strudel documentation pages!
These pages will introduce you to [Strudel](https://strudel.tidalcycles.org/), a web-based [live coding](https://github.com/toplap/awesome-livecoding/) environment that implements the [Tidal Cycles](https://tidalcycles.org) algorithmic pattern language.
# What is Strudel?
@ -29,7 +28,7 @@ Strudel however runs directly in your web browser, does not require any custom s
The main place to actually make music with Strudel is the [Strudel REPL](https://strudel.tidalcycles.org/) ([what is a REPL?](https://en.wikipedia.org/wiki/Read%E2%80%93eval%E2%80%93print_loop)), but in these pages you will also encounter interactive "MiniREPLs" where you can listen to and edit Strudel patterns.
Try clicking the play icon below:
<MiniRepl client:idle tune={`s("bd sn")`}/>
<MiniRepl client:idle tune={`s("bd sn")`} />
Then edit the text so it reads `s("bd sn cp hh")` and click the refresh icon.
Congratulations, you have now live coded your first Strudel pattern!
@ -78,13 +77,13 @@ s("bd,[~ <sd!3 sd(3,4,2)>],hh(3,4)") // drums
# Strudel is a work in progress 🚧
Please note that this project is still in its experimental state.
Please note that this project is still in its experimental state.
In the future, parts of it might change significantly.
This tutorial is also far from complete.
This tutorial is also far from complete.
You can contribute to it clicking 'Edit this page' in the top right, or by visiting the [Strudel GitHub page](https://github.com/tidalcycles/strudel/).
# What's next?
Head on over to the [Notes](/learn/notes) page.
<br/>
<br />

2
website/src/pages/learn/input-output.mdx
View File

@ -69,4 +69,4 @@ The following functions can be used with [SuperDirt](https://github.com/musikinf
Please refer to [Tidal Docs](https://tidalcycles.org/) for more info.
<br/>
<br />

6
website/src/pages/learn/mini-notation.mdx
View File

@ -200,7 +200,7 @@ Let's look at those three parameters in detail.
## Beats
`beats`: the first parameter controls how may beats will be played.
`beats`: the first parameter controls how may beats will be played.
Compare these:
<MiniRepl client:idle tune={`s("bd(2,8)")`} />
@ -217,7 +217,7 @@ Compare these:
## Offsets
`offset`: the third (optional) parameter controls the starting position for distributing the beats.
`offset`: the third (optional) parameter controls the starting position for distributing the beats.
We need a secondary rhythm to hear the difference:
<MiniRepl client:idle tune={`s("bd(3,8,0), hh cp")`} />
@ -232,4 +232,4 @@ Starting with this one `n`, can you make a _pattern string_ that uses every sing
<MiniRepl client:idle tune={`n("60")`} />
<br/>
<br />

15
website/src/pages/learn/notes.mdx
View File

@ -14,13 +14,18 @@ In Strudel, there are three different ways to express a pitch, `note`, `n` and `
Here's the same pattern written in three different ways:
- `note`: letter notation, good for those who are familiar with western music theory:
<MiniRepl client:idle tune={`note("a3 c#4 e4 a4")`} />
{' '}
<MiniRepl client:idle tune={`note("a3 c#4 e4 a4")`} />
- `n`: number notation, good for those who want to use recognisable pitches, but don't care about music theory:
<MiniRepl client:idle tune={`n("57 61 64 69")`} />
{' '}
<MiniRepl client:idle tune={`n("57 61 64 69")`} />
- `freq`: frequency notation, good for those who want to go beyond standardised tuning systems:
<MiniRepl client:idle tune={`freq("220 275 330 440")`} />
{' '}
<MiniRepl client:idle tune={`freq("220 275 330 440")`} />
Let's look at `note`, `n` and `freq` in more detail...
@ -81,8 +86,8 @@ In this page, when we played a pattern of notes like this:
We heard a simple synthesised sound, in fact we heard a [square wave oscillator](https://en.wikipedia.org/wiki/Square_wave).
This is the default synthesiser used by Strudel, but how do we then make different sounds in Strudel?
This is the default synthesiser used by Strudel, but how do we then make different sounds in Strudel?
Let's find out in the next page on [Sounds](/learn/sounds).
<br/>
<br />

41
website/src/pages/learn/samples.mdx
View File

@ -23,7 +23,8 @@ To know which sounds are available, open the [default sample map](https://strude
You can load your own sample map using the `samples` function.
In this example we create a map using sounds from the default sample map:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
bd: 'bd/BT0AADA.wav',
sd: 'sd/rytm-01-classic.wav',
@ -35,7 +36,8 @@ s("bd sd,hh*8")`}
When you load your own samples, you can choose the names that you will then refer to in your pattern string inside the `s` function.
Compare with this example which uses the same samples, but with different names.
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
bassdrum: 'bd/BT0AADA.wav',
snaredrum: 'sd/rytm-01-classic.wav',
@ -49,15 +51,17 @@ Here we have changed the "map" to include longer sample names.
# Loading Custom Samples
The `samples` function has two arguments:
- A [JavaScript object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object) that maps sound names to audio file paths.
- A base URL that comes before each path describing where the sample folder can be found online.
- A base URL that comes before each path describing where the sample folder can be found online.
- Make sure your base URL ends with a slash, while your sample paths do **not** begin with one!
To see how this looks in practice, compare the [DirtSamples GitHub repo](https://github.com/tidalcycles/Dirt-Samples) with the previous sample map example.
Because GitHub is a popular place for uploading open source samples, it has its own shortcut:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
bd: 'bd/BT0AADA.wav',
sd: 'sd/rytm-01-classic.wav',
@ -71,7 +75,8 @@ The format is `github:user/repo/branch/`.
Let's see another example, this time based on the following GitHub repo: https://github.com/jarmitage/jarmitage.github.io.
We can see there are some guitar samples inside the `/samples` folder, so let's try to load them:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
g0: 'samples/guitar/guitar_0.wav',
g1: 'samples/guitar/guitar_1.wav',
@ -86,7 +91,8 @@ s("[g0 g1 g2 g3 g4]/5")`}
It is also possible, to declare multiple files for one sound, using the array notation:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
bd: ['bd/BT0AADA.wav','bd/BT0AAD0.wav'],
sd: ['sd/rytm-01-classic.wav','sd/rytm-00-hard.wav'],
@ -98,7 +104,8 @@ s("<bd:0 bd:1>,~ <sd:0 sd:1>,[hh:0 hh:1]*2")`}
The `:0` `:1` etc. are the indices of the array.
The sample number can also be set using `n`:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
bd: ['bd/BT0AADA.wav','bd/BT0AAD0.wav'],
sd: ['sd/rytm-01-classic.wav','sd/rytm-00-hard.wav'],
@ -109,7 +116,8 @@ s("bd,~ sd,hh*4").n("<0 1>")`}
In that case, we might load our guitar sample map a different way:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
guitar: [
'samples/guitar/guitar_0.wav',
@ -124,7 +132,8 @@ s("[guitar:0 guitar:1 guitar:2 guitar:3 guitar:4]/5")`}
And as above, we can choose the sample number using `n` for even more flexibility:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
guitar: [
'samples/guitar/guitar_0.wav',
@ -141,7 +150,8 @@ n("<0 1 2 3 4>").s("guitar")`}
For pitched sounds, you can use `note`, just like with synths:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
'gtr': 'gtr/0001_cleanC.wav',
}, 'github:tidalcycles/Dirt-Samples/master/');
@ -151,7 +161,8 @@ note("g3 [bb3 c4] <g4 f4 eb4 f3>@2").s('gtr').gain(.5)`}
Here, the guitar samples will overlap, because they always play till the end.
If we want them to behave more like a synth, we can add `clip(1)`:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
'gtr': 'gtr/0001_cleanC.wav',
}, 'github:tidalcycles/Dirt-Samples/master/');
@ -163,7 +174,8 @@ note("g3 [bb3 c4] <g4 f4 eb4 f3>@2").s('gtr').clip(1)
If we have 2 samples with different base pitches, we can make them in tune by specifying the pitch like this:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
'gtr': 'gtr/0001_cleanC.wav',
'moog': { 'g3': 'moog/005_Mighty%20Moog%20G3.wav' },
@ -176,7 +188,8 @@ If a sample has no pitch set, `c3` is the default.
We can also declare different samples for different regions of the keyboard:
<MiniRepl client:idle
<MiniRepl
client:idle
tune={`samples({
'moog': {
'g2': 'moog/004_Mighty%20Moog%20G2.wav',
@ -212,4 +225,4 @@ Almost everything in Tidal can be patterned using strings!
<JsDoc client:idle name="Pattern.chop" h={0} />
<br/>
<br />

7
website/src/pages/learn/sounds.mdx
View File

@ -10,10 +10,11 @@ import { JsDoc } from '../../docs/JsDoc';
# Sounds
We can play sounds with `s`, in two different ways:
- `s` can trigger audio samples, where a sound file is loaded in the background and played back:
<MiniRepl client:idle tune={`s("bd hh sd hh")`} />
<MiniRepl client:idle tune={`s("bd hh sd hh")`} />
- `s` can trigger audio synthesisers, which are synthesised in real-time using code also running in the background:
<MiniRepl client:idle tune={`s("sawtooth square triangle sine")`} />
<MiniRepl client:idle tune={`s("sawtooth square triangle sine")`} />
You can learn more about both of these approaches in the pages [Synths](/learn/synths) and [Samples](/learn/samples).
@ -37,4 +38,4 @@ Hmm, something interesting is going on there, related to there being five notes
Let's now take a step back and think about the Strudel [Code](/learn/code) we've been hearing so far.
<br/>
<br />

5
website/src/pages/learn/synths.mdx
View File

@ -34,8 +34,9 @@ Now we not only pattern the notes, but the sound as well!
You can control the envelope of a synth using the `attack`, `decay`, `sustain` and `release` functions:
<MiniRepl
client:idle tune={`note("c2 <eb2 <g2 g1>>").s('sawtooth')
client:idle
tune={`note("c2 <eb2 <g2 g1>>").s('sawtooth')
.attack(.1).decay(.1).sustain(.2).release(.1)`}
/>
<br/>
<br />