From 62fdba0600246aac379b5c22591183e75aa18be8 Mon Sep 17 00:00:00 2001 From: Felix Roos Date: Sat, 7 Jan 2023 22:12:35 +0100 Subject: [PATCH] pull apart functional docs --- packages/core/pattern.mjs | 6 +- website/src/config.ts | 14 +- website/src/pages/functions/intro.mdx | 40 +++ .../src/pages/functions/value-modifiers.mdx | 61 +++++ .../src/pages/learn/conditional-modifiers.mdx | 43 +++ website/src/pages/learn/factories.mdx | 91 +++++++ website/src/pages/learn/functions.mdx | 250 ------------------ website/src/pages/learn/time-modifiers.mdx | 64 +++++ 8 files changed, 314 insertions(+), 255 deletions(-) create mode 100644 website/src/pages/functions/intro.mdx create mode 100644 website/src/pages/functions/value-modifiers.mdx create mode 100644 website/src/pages/learn/conditional-modifiers.mdx create mode 100644 website/src/pages/learn/factories.mdx delete mode 100644 website/src/pages/learn/functions.mdx create mode 100644 website/src/pages/learn/time-modifiers.mdx diff --git a/packages/core/pattern.mjs b/packages/core/pattern.mjs index 2af83df9..6ced2bae 100644 --- a/packages/core/pattern.mjs +++ b/packages/core/pattern.mjs @@ -712,7 +712,7 @@ export class Pattern { * @memberof Pattern * @example * s("hh*2").stack( - * n("c2(3,8)") + * note("c2(3,8)") * ) */ stack(...pats) { @@ -729,7 +729,7 @@ export class Pattern { * @memberof Pattern * @example * s("hh*2").seq( - * n("c2(3,8)") + * note("c2(3,8)") * ) */ seq(...pats) { @@ -742,7 +742,7 @@ export class Pattern { * @memberof Pattern * @example * s("hh*2").cat( - * n("c2(3,8)") + * note("c2(3,8)") * ) */ cat(...pats) { diff --git a/website/src/config.ts b/website/src/config.ts index 088782f1..31ded0f1 100644 --- a/website/src/config.ts +++ b/website/src/config.ts @@ -49,12 +49,22 @@ export const SIDEBAR: Sidebar = { { text: 'Sounds', link: 'learn/sounds' }, { text: 'Coding syntax', link: 'learn/code' }, { text: 'Mini-Notation', link: 'learn/mini-notation' }, + { text: 'Signals', link: 'learn/signals' }, + ], + 'Making Sound': [ { text: 'Samples', link: 'learn/samples' }, { text: 'Synths', link: 'learn/synths' }, { text: 'Audio Effects', link: 'learn/effects' }, - { text: 'Functions', link: 'learn/functions' }, - { text: 'Signals', link: 'learn/signals' }, + ], + Functions: [ + { text: 'Introduction', link: 'functions/intro' }, + { text: 'Value Modifiers', link: 'functions/value-modifiers' }, + { text: 'Factories', link: 'learn/factories' }, + { text: 'Time Modifiers', link: 'learn/time-modifiers' }, + { text: 'Conditional Modifiers', link: 'learn/conditional-modifiers' }, { text: 'Tonal', link: 'learn/tonal' }, + ], + More: [ { text: 'MIDI & OSC', link: 'learn/input-output' }, { text: 'Strudel vs Tidal', link: 'learn/strudel-vs-tidal' }, ], diff --git a/website/src/pages/functions/intro.mdx b/website/src/pages/functions/intro.mdx new file mode 100644 index 00000000..2e507e40 --- /dev/null +++ b/website/src/pages/functions/intro.mdx @@ -0,0 +1,40 @@ +--- +title: Introduction +layout: ../../layouts/MainLayout.astro +--- + +import { MiniRepl } from '../../docs/MiniRepl'; +import { JsDoc } from '../../docs/JsDoc'; + +# Functional JavaScript API + +While the mini notation is powerful on its own, there is much more to discover. +Internally, the mini notation will expand to use the actual functional JavaScript API. + +For example, this Pattern in Mini Notation: + + + +is equivalent to this Pattern without Mini Notation: + + + +Similarly, there is an equivalent function for every aspect of the mini notation. + +Which representation to use is a matter of context. As a rule of thumb, you can think of the JavaScript API +to fit better for the larger context, while mini notation is more practical for individiual rhythms. + +## Limits of Mini Notation + +While the Mini Notation is a powerful way to write rhythms shortly, it also has its limits. Take this example: + + + +Here, we are using mini notation for the individual rhythms, while using the function `stack` to mix them. +While stack is also available as `,` in mini notation, we cannot use it here, because we have different types of sounds. diff --git a/website/src/pages/functions/value-modifiers.mdx b/website/src/pages/functions/value-modifiers.mdx new file mode 100644 index 00000000..1f949b01 --- /dev/null +++ b/website/src/pages/functions/value-modifiers.mdx @@ -0,0 +1,61 @@ +--- +title: Value Modifiers +layout: ../../layouts/MainLayout.astro +--- + +import { MiniRepl } from '../../docs/MiniRepl'; +import { JsDoc } from '../../docs/JsDoc'; + +# Value Modifiers + +## Notes + +Notes are automatically available as variables: + + + +An important difference to the mini notation: +For sharp notes, the letter "s" is used instead of "#", because JavaScript does not support "#" in a variable name. + +The above is the same as: + + + +Using strings, you can also use "#". + +## Alternative Syntax + +In the above example, we are nesting a function inside a function, which makes reading the parens a little more difficult. +To avoid getting to many nested parens, there is an alternative syntax to add a type to a pattern: + + + +You can use this with any function that declares a type (like `n`, `s`, `note`, `freq` etc), just make sure to leave the parens empty! + +## Pattern.add + + + +## Pattern.sub + + + +## Pattern.mul + + + +## Pattern.div + + + +## Pattern.round + + + +## Pattern.apply + + + +## Pattern.range + + diff --git a/website/src/pages/learn/conditional-modifiers.mdx b/website/src/pages/learn/conditional-modifiers.mdx new file mode 100644 index 00000000..6e4966df --- /dev/null +++ b/website/src/pages/learn/conditional-modifiers.mdx @@ -0,0 +1,43 @@ +--- +title: Conditional Modifiers +layout: ../../layouts/MainLayout.astro +--- + +import { MiniRepl } from '../../docs/MiniRepl'; +import { JsDoc } from '../../docs/JsDoc'; + +# Conditional Modifiers + +## every + + + +## when + + + +# Accumulation Modifiers + +## stack + + + +## superimpose + + + +## layer + + + +## off + + + +## echo + + + +## echoWith + + diff --git a/website/src/pages/learn/factories.mdx b/website/src/pages/learn/factories.mdx new file mode 100644 index 00000000..957ecf78 --- /dev/null +++ b/website/src/pages/learn/factories.mdx @@ -0,0 +1,91 @@ +--- +title: Pattern Factories +description: Strudel Tutorial +layout: ../../layouts/MainLayout.astro +--- + +import { MiniRepl } from '../../docs/MiniRepl'; +import { JsDoc } from '../../docs/JsDoc'; + +# Pattern Factories + +The following functions will return a pattern. +Most of these are also used by the Mini Notation: + +| function | mini | +| ------------------------------ | --------------- | +| `cat(x, y)` | `""` | +| `seq(x, y)` | `"x y"` | +| `stack(x, y)` | `"x,y"` | +| `timeCat([3,x],[2,y])` | `"x@2 y@2"` | +| `polymeter([a, b, c], [x, y])` | `"{a b c, x y}"` | +| `polymeterSteps(2, x, y, z)` | `"{x y z}%2"` | + +## cat + + + +You can also use cat as a chained function like this: + + + +## seq + + + +Or as a chained function: + + + +## stack + + + +As a chained function: + + + +## timeCat + + + +## polymeter + + + +## polymeterSteps + + + +# Combining Patterns + +You can freely mix JS patterns, mini patterns and values! For example, this pattern: + + + +...is equivalent to: + + + +... as well as: + +")`} /> + +While mini notation is almost always shorter, it only has a handful of modifiers: \* / ! @. +When using JS patterns, there is a lot more you can do. diff --git a/website/src/pages/learn/functions.mdx b/website/src/pages/learn/functions.mdx deleted file mode 100644 index 0cc83dc2..00000000 --- a/website/src/pages/learn/functions.mdx +++ /dev/null @@ -1,250 +0,0 @@ ---- -title: What is Strudel? -description: Strudel Tutorial -layout: ../../layouts/MainLayout.astro ---- - -import { MiniRepl } from '../../docs/MiniRepl'; -import { JsDoc } from '../../docs/JsDoc'; - -# Functional JavaScript API - -While the mini notation is powerful on its own, there is much more to discover. -Internally, the mini notation will expand to use the actual functional JavaScript API. - -For example, this Pattern in Mini Notation: - - - -is equivalent to this Pattern without Mini Notation: - - - -Similarly, there is an equivalent function for every aspect of the mini notation. - -Which representation to use is a matter of context. As a rule of thumb, you can think of the JavaScript API -to fit better for the larger context, while mini notation is more practical for individiual rhythms. - -## Limits of Mini Notation - -While the Mini Notation is a powerful way to write rhythms shortly, it also has its limits. Take this example: - - - -Here, we are using mini notation for the individual rhythms, while using the function `stack` to mix them. -While stack is also available as `,` in mini notation, we cannot use it here, because we have different types of sounds. - -## Notes - -Notes are automatically available as variables: - - - -An important difference to the mini notation: -For sharp notes, the letter "s" is used instead of "#", because JavaScript does not support "#" in a variable name. - -The above is the same as: - - - -Using strings, you can also use "#". - -## Alternative Syntax - -In the above example, we are nesting a function inside a function, which makes reading the parens a little more difficult. -To avoid getting to many nested parens, there is an alternative syntax to add a type to a pattern: - - - -You can use this with any function that declares a type (like `n`, `s`, `note`, `freq` etc), just make sure to leave the parens empty! - -## Pattern Factories - -The following functions will return a pattern. - -### cat - - - -### seq - - - -### stack - - - -### timeCat - - - -## Combining Patterns - -You can freely mix JS patterns, mini patterns and values! For example, this pattern: - - - -...is equivalent to: - - - -... as well as: - -")`} /> - -While mini notation is almost always shorter, it only has a handful of modifiers: \* / ! @. -When using JS patterns, there is a lot more you can do. - -## Time Modifiers - -The following functions modify a pattern temporal structure in some way. - -### Pattern.slow - - - -### Pattern.fast - - - -### Pattern.early - - - -### Pattern.late - - - -### Pattern.legato - - - -### Pattern.struct - - - -### Pattern.euclid - - - -### Pattern.euclidLegato - - - -### Pattern.rev - - - -### Pattern.iter - - - -### Pattern.iterBack - - - -## Conditional Modifiers - -### Pattern.every - - - -### Pattern.when - - - -## Accumulation Modifiers - -### Pattern.stack - - - -### Pattern.superimpose - - - -### Pattern.layer - - - -### Pattern.off - - - -### Pattern.echo - - - -### Pattern.echoWith - - - -## Concat Modifiers - -### Pattern.seq - - - -### Pattern.cat - - - -## Value Modifiers - -### Pattern.add - - - -### Pattern.sub - - - -### Pattern.mul - - - -### Pattern.div - - - -### Pattern.round - - - -### Pattern.apply - - - -### Pattern.range - - - -### Pattern.chunk - - - -### Pattern.chunkBack - - diff --git a/website/src/pages/learn/time-modifiers.mdx b/website/src/pages/learn/time-modifiers.mdx new file mode 100644 index 00000000..7e41ed34 --- /dev/null +++ b/website/src/pages/learn/time-modifiers.mdx @@ -0,0 +1,64 @@ +--- +title: Pattern Factories +description: Strudel Tutorial +layout: ../../layouts/MainLayout.astro +--- + +import { MiniRepl } from '../../docs/MiniRepl'; +import { JsDoc } from '../../docs/JsDoc'; + +# Time Modifiers + +The following functions modify a pattern temporal structure in some way. + +## slow + + + +## fast + + + +## early + + + +## late + + + +## legato + + + +## struct + + + +## euclid + + + +## euclidLegato + + + +## rev + + + +## iter + + + +## iterBack + + + +### chunk + + + +### chunkBack + +