Check-in [a03a381331]
Many hyperlinks are disabled.
Use anonymous login
to enable hyperlinks.
Overview
| Comment: | Cleanup of Docs |
|---|---|
| Downloads: | Tarball | ZIP archive | SQL archive |
| Timelines: | family | ancestors | descendants | both | trunk |
| Files: | files | file ages | folders |
| SHA3-256: |
a03a38133144bd53b40680b7dec24d42 |
| User & Date: | dev 2021-11-16 10:11:35 |
Context
|
2022-02-15
| ||
| 23:20 | Cleanup post presentation Worklet code check-in: 941581eece user: dev tags: trunk | |
|
2021-11-16
| ||
| 10:11 | Cleanup of Docs check-in: a03a381331 user: dev tags: trunk | |
|
2021-11-13
| ||
| 18:29 | Minor updates check-in: f4bfc3000a user: dev tags: trunk | |
Changes
Changes to build/html/alternate-implementation.html.
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Saving and Sharing" href="saving.html" />
<link rel="prev" title="Concepts and Code Walkthrough" href="main.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="main.html" title="previous page">Concepts and Code Walkthrough</a>
<a class='right-next' id="next-link" href="saving.html" title="next page">Saving and Sharing</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
| | | | | < < < < < | | | |
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Saving and other limitations" href="limitations.html" />
<link rel="prev" title="Code Walkthrough" href="main.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="main.html" title="previous page">Code Walkthrough</a>
<a class='right-next' id="next-link" href="limitations.html" title="next page">Saving and other limitations</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
Changes to build/html/bookmarks.html.
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
...
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="saving.html"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
|
|
|
<
<
<
<
<
|
|
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
...
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Getting Started </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> Core Features </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Saving and other limitations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
Changes to build/html/changelog.html.
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Concepts and Code Walkthrough" href="main.html" />
<link rel="prev" title="Early Attempts" href="early-attempts.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span> <span class="n">Theme</span> <span class="n">changes</span>
<span class="n">Lots</span> <span class="n">of</span> <span class="n">Docs</span>
<span class="n">Tutorials</span>
<span class="n">Working</span> <span class="n">visuals</span>
<span class="n">Code</span> <span class="n">Mirror</span> <span class="n">Issue</span>
</pre></div>
</div>
</div>
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="early-attempts.html" title="previous page">Early Attempts</a>
<a class='right-next' id="next-link" href="main.html" title="next page">Concepts and Code Walkthrough</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
| | | | < < < < < | > > > > > > > > > > | |
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Code Walkthrough" href="main.html" />
<link rel="prev" title="Early Attempts" href="early-attempts.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span> <span class="n">Theme</span> <span class="n">changes</span>
<span class="n">Lots</span> <span class="n">of</span> <span class="n">Docs</span>
<span class="n">Tutorials</span>
<span class="n">Working</span> <span class="n">visuals</span>
<span class="n">Code</span> <span class="n">Mirror</span> <span class="n">Issue</span>
</pre></div>
</div>
<p>Oct - Nov 2021 - ADC21</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span> <span class="n">Updated</span> <span class="n">the</span> <span class="n">sequencer</span> <span class="n">notation</span>
<span class="n">Second</span> <span class="n">Demo</span> <span class="n">Song</span>
<span class="n">Autocommit</span>
<span class="n">Keyboard</span> <span class="n">Bindings</span>
<span class="n">Reverting</span> <span class="n">to</span> <span class="n">setInterval</span>
<span class="n">Added</span> <span class="n">code</span> <span class="k">for</span> <span class="n">p5</span>
<span class="n">Update</span> <span class="n">the</span> <span class="n">docs</span>
</pre></div>
</div>
</div>
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="early-attempts.html" title="previous page">Early Attempts</a>
<a class='right-next' id="next-link" href="main.html" title="next page">Code Walkthrough</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
Changes to build/html/credits.html.
33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 |
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Bookmarks" href="bookmarks.html" />
<link rel="prev" title="Limitations and Recording" href="limitations.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="limitations.html" title="previous page">Limitations and Recording</a>
<a class='right-next' id="next-link" href="bookmarks.html" title="next page">Bookmarks</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
| | | | < < < < < | | |
33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 |
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Bookmarks" href="bookmarks.html" />
<link rel="prev" title="Saving and other limitations" href="limitations.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="limitations.html" title="previous page">Saving and other limitations</a>
<a class='right-next' id="next-link" href="bookmarks.html" title="next page">Bookmarks</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
Changes to build/html/demo.html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 ... 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Demo and Tutorial — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="tocsection onthispage pt-5 pb-3">
<i class="fas fa-list"></i> Contents
</div>
<nav id="bd-toc-nav">
<ul class="visible nav section-nav flex-column">
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#video">
Video
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#demo-song-1-techno">
Demo Song 1 // Techno
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#getting-started">
Getting Started
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#tutorial">
Tutorial
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#full-code">
Full Code
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="demo-and-tutorial">
<h1>Demo and Tutorial<a class="headerlink" href="#demo-and-tutorial" title="Permalink to this headline">¶</a></h1>
<div class="section" id="video">
<h2>Video<a class="headerlink" href="#video" title="Permalink to this headline">¶</a></h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/GTfmTMrSpag" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<p>Postprocessed using Reaper with EQ and Surround effects to add some sparkle.
Video is recorded with the help of Blackhole and Kap and rendered by Reaper.</p>
<p>Samples taken from Deep Techno and Dub Techno collections from splice. Sadly I can’t distribute the song itself as I would also have to distribute the samples with it.</p>
</div>
<div class="section" id="demo-song-1-techno">
<h2>Demo Song 1 // Techno<a class="headerlink" href="#demo-song-1-techno" title="Permalink to this headline">¶</a></h2>
<p>Code for the Demo Song. The visualisation was disabled in the Demo as it was causing a huge lag while recording on both windows and mac.</p>
<p>Note: Could could be outdated due to latest changes to the API.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">volume_guard1</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">volume_guard2</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard1</span><span class="p">(</span><span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">30</span><span class="p">)</span> <span class="o">-</span><span class="mi">20</span><span class="p">);</span>
<span class="o">//</span><span class="n">mem</span><span class="p">[</span><span class="s2">"stab_channel"</span><span class="p">]</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard2</span><span class="p">(</span><span class="o">-</span><span class="mi">2</span><span class="p">);</span>
<span class="o">//</span><span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">);</span>
................................................................................
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
</div>
<div class="section" id="getting-started">
<h2>Getting Started<a class="headerlink" href="#getting-started" title="Permalink to this headline">¶</a></h2>
<p>This illustrates the core concepts of bitrhythm.</p>
<ol class="simple">
<li><p>Samples (Tone.Sampler)</p></li>
<li><p>Dials (use cellx internally)</p></li>
<li><p>Observers (cellx)</p></li>
</ol>
<p>See <a class="reference external" href="https://tonejs.github.io/">https://tonejs.github.io/</a> for more notes.</p>
<p>For an understanding of the global variables see the concepts and code walkthrough section.</p>
<div class="highlight-none notranslate"><div class="highlight"><pre><span></span>- patterns and track_no
- isHit, current_bit
- samples
- Tone
- cellx
- window and any thing included with the script tag is available here
</pre></div>
</div>
<p><code class="docutils literal notranslate"><span class="pre">mem</span></code> is short for memory. All instruments and effects are saved here so that they can be accessed everywhere.</p>
<p>Step to create the basic song.</p>
<ol class="simple">
<li><p>Click on <code class="docutils literal notranslate"><span class="pre">Add</span> <span class="pre">Sample</span> <span class="pre">URL</span></code> to add the following URLs</p>
<ul class="simple">
<li><p>/Kick01.wav</p></li>
<li><p>/Snare19.wav</p></li>
<li><p>/Closedhat01.wav</p></li>
<li><p>/MiscSynthStab04.wav</p></li>
</ul>
</li>
<li><p>Click on <code class="docutils literal notranslate"><span class="pre">Add</span> <span class="pre">Dial</span></code></p></li>
<li><p>Enter the following into the window</p></li>
</ol>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">scene1</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1000 1000 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">scene2</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1011 1001 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">patterns</span> <span class="o">=</span> <span class="n">scene1</span>
<span class="n">var</span> <span class="n">once</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="o">-</span><span class="mi">30</span>
<span class="n">mem</span><span class="o">.</span><span class="n">master</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Destination</span><span class="p">);</span>
<span class="n">mem</span><span class="o">.</span><span class="n">volume_guard</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="o">-</span><span class="mi">10</span><span class="p">]);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"k"</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"h"</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"sn"</span><span class="p">,</span> <span class="mi">2</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"ex"</span><span class="p">]</span> <span class="o">=</span> <span class="n">function</span> <span class="p">(</span><span class="n">val</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">val</span> <span class="o">></span> <span class="mf">0.5</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">true</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span><span class="o">.</span><span class="n">onChange</span><span class="p">(</span><span class="n">function</span> <span class="p">(</span><span class="n">e</span><span class="p">)</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">val</span> <span class="o">=</span> <span class="n">parseFloat</span><span class="p">(</span><span class="n">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">]</span><span class="o">.</span><span class="n">value</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"ex"</span><span class="p">](</span><span class="n">val</span><span class="p">);</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o"><=</span> <span class="mi">3</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">once</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">tweak</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">isHit</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">3</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">])</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="p">};</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p>Now try changing the code.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">patterns</span> <span class="o">=</span> <span class="n">scene2</span>
</pre></div>
</div>
<p>Increase the dial to see the addition of the snare. This is how you can use observers to trigger unrelated changes. I call them sideevents, as the logic is similar to sidechain, which typically observers the volume.</p>
<p>Comment and Uncomment lines in the <code class="docutils literal notranslate"><span class="pre">if</span> <span class="pre">(isHit)</span></code> block. To mute and unmute sections.</p>
<p><em>Note:</em> <code class="docutils literal notranslate"><span class="pre">mem["k0_channel"].solo</span> <span class="pre">=</span> <span class="pre">true;</span></code> is not working.</p>
<p><strong>Visuals</strong></p>
<p>Change the once function to this and click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Execute</span> <span class="pre">Once</span></code></p>
<p>Code is taken from butterchurn. Try changing <a class="reference external" href="https://butterchurnviz.com/">presets</a> to get different visuals.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">tweak</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">initWinamp</span><span class="p">(</span><span class="s2">"_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"</span><span class="p">);</span>
<span class="n">render_loop</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">window</span><span class="o">.</span><span class="n">visualizer</span><span class="o">.</span><span class="n">render</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p><strong>Tweaking</strong></p>
<p>First click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Number</span></code>. This is useful to check if the knob function is actually working. And click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Execute</span> <span class="pre">Once</span></code></p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">tweak</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="o">.</span><span class="n">k1</span> <span class="o">=</span> <span class="n">knob</span><span class="p">({</span><span class="n">ramp</span> <span class="p">:</span> <span class="p">[</span><span class="mf">0.09</span><span class="p">,</span><span class="mf">1.8</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">,</span> <span class="mi">2</span><span class="p">,</span> <span class="mf">1.5</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.5</span><span class="p">,</span> <span class="mi">3</span><span class="p">,</span> <span class="mi">5</span><span class="p">,</span> <span class="mi">8</span><span class="p">,</span> <span class="mi">2</span><span class="p">],</span> <span class="s2">"number"</span><span class="p">:</span> <span class="n">numbers</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"v"</span><span class="p">]</span> <span class="p">});</span>
<span class="n">always</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"k0_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">mem</span><span class="o">.</span><span class="n">k1</span><span class="o">.</span><span class="n">move</span><span class="p">()</span> <span class="o">*</span> <span class="mi">1000</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p>As you can sere numbers and dials will be available as a global array.</p>
<p>There is no way to remove them so be careful about the order in which you add them.</p>
<p>The following code will always be executed as its at the top level. As you can see this code implies that the first dial is connected to the master volume. Use guards to avoid going deaf as someundefineds editing can created bad frequency numbers.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard</span><span class="p">((</span><span class="mi">1</span> <span class="o">-</span> <span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]())</span> <span class="o">*</span> <span class="o">-</span><span class="mi">30</span><span class="p">);</span>
</pre></div>
</div>
</div>
<div class="section" id="tutorial">
<h2>Tutorial<a class="headerlink" href="#tutorial" title="Permalink to this headline">¶</a></h2>
<ul class="simple">
<li><p>Kick + Filter</p></li>
<li><p>Snare + Filter</p></li>
<li><p>Snare + Filter + Delay</p></li>
<li><p>High Hat</p></li>
<li><p>Lead + Filter</p></li>
<li><p>Dub Stab + Filter + Reverb</p></li>
</ul>
<p>Tip: In Tone.js you can’t call connect one after another, you need to use chain.</p>
<p>TODO: Add glide to Lead to make it more 303 sounding</p>
<p>Master is connected with Surround and Volume Limiter.
Use Gates and Limiters to avoid going deaf.</p>
<p>Tone.MultiInstrument gave lots of glitches, so custom voices are written in the voice function</p>
<p>Channels provide</p>
<ul class="simple">
<li><p>Mute</p></li>
<li><p>Solo</p></li>
</ul>
<p>More improvements for the Stab</p>
<div class="highlight-none notranslate"><div class="highlight"><pre><span></span>- Chorus or Phaser
- Compressor
- Decay in envelope
- Separate filters
- EQ
- Sends for more delay
- LFO for filters
</pre></div>
</div>
<p>Freeverb does not work and also needs Mono to function properly</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">reverb</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Freeverb</span><span class="p">()</span><span class="o">.</span><span class="n">toDestination</span><span class="p">();</span>
<span class="n">var</span> <span class="n">reverb_mono</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Mono</span><span class="p">()</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">reverb</span><span class="p">);</span>
<span class="n">reverb</span><span class="o">.</span><span class="n">dampening</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">reverb</span><span class="o">.</span><span class="n">roomSize</span> <span class="o">=</span> <span class="mf">0.9</span><span class="p">;</span>
</pre></div>
</div>
</div>
<div class="section" id="full-code">
<h2>Full Code<a class="headerlink" href="#full-code" title="Permalink to this headline">¶</a></h2>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">volume_guard1</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard1</span><span class="p">(</span><span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">30</span><span class="p">)</span> <span class="o">-</span><span class="mi">20</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="s2">"stab_channel"</span><span class="p">]</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard2</span><span class="p">(</span><span class="o">-</span><span class="mi">2</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">);</span>
<span class="n">scene1</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1000 1000 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0x00 0000 0000 x000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p xx0x c0x0 x0x0 x0xx"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p x000 x0x0 0000 x0x0"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">patterns</span> <span class="o">=</span> <span class="n">scene1</span>
<span class="n">function</span> <span class="n">NoiseSynth</span> <span class="p">(</span><span class="n">name</span><span class="p">)</span> <span class="p">{</span>
<span class="n">name</span> <span class="o">=</span> <span class="n">name</span> <span class="o">||</span> <span class="s2">"wf"</span><span class="p">;</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">StereoWidener</span><span class="p">({</span><span class="n">width</span><span class="p">:</span> <span class="mi">1</span><span class="p">});</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Noise</span><span class="p">(</span><span class="s2">"pink"</span><span class="p">)</span><span class="o">.</span><span class="n">start</span><span class="p">();</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">400</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">,</span> <span class="n">pan</span><span class="p">:</span> <span class="o">-</span><span class="mf">0.8</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">],</span> <span class="n">mem</span><span class="o">.</span><span class="n">master</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span><span class="p">]</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">])</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">Stab</span><span class="p">(</span><span class="n">name</span><span class="p">)</span> <span class="p">{</span>
<span class="n">name</span> <span class="o">=</span> <span class="n">name</span> <span class="o">||</span> <span class="s2">"stab"</span><span class="p">;</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">5250</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_hfilter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">80</span><span class="p">,</span> <span class="s1">'highpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_reverb"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Reverb</span><span class="p">(</span><span class="mf">0.1</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">FeedbackDelay</span><span class="p">(</span><span class="s2">"4n"</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_pdelay"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">PingPongDelay</span><span class="p">(</span><span class="s2">"2n"</span><span class="p">,</span> <span class="mf">0.1</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">StereoWidener</span><span class="p">({</span><span class="n">width</span><span class="p">:</span> <span class="mf">0.25</span><span class="p">});</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">2</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="p">,</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_reverb"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_hfilter"</span><span class="p">]</span> <span class="p">,</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">],</span> <span class="n">mem</span><span class="o">.</span><span class="n">master</span><span class="p">)</span>
<span class="n">function</span> <span class="n">voice</span><span class="p">(</span><span class="n">no</span><span class="p">,</span> <span class="nb">type</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_synth"</span> <span class="o">+</span> <span class="n">no</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">MonoSynth</span><span class="p">({</span>
<span class="n">oscillator</span><span class="p">:</span> <span class="p">{</span>
<span class="nb">type</span><span class="p">:</span> <span class="nb">type</span>
<span class="p">}</span>
<span class="p">})</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_synth"</span> <span class="o">+</span> <span class="n">no</span><span class="p">]</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]);</span>
<span class="p">}</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">1</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">2</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">3</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">4</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">5</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">6</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">s</span><span class="p">(</span><span class="n">vel</span><span class="p">,</span> <span class="n">notes</span><span class="p">,</span> <span class="n">duration</span><span class="p">)</span> <span class="p">{</span>
<span class="n">vel</span> <span class="o">=</span> <span class="n">vel</span> <span class="o">||</span> <span class="mf">1.0</span><span class="p">;</span>
<span class="n">duration</span> <span class="o">=</span> <span class="n">duration</span> <span class="o">||</span> <span class="s2">"2n"</span><span class="p">;</span>
<span class="n">notes</span> <span class="o">=</span> <span class="n">notes</span> <span class="o">||</span> <span class="p">[</span><span class="s2">"E2"</span><span class="p">,</span> <span class="s2">"B2"</span><span class="p">,</span> <span class="s2">"G2"</span><span class="p">];</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth1"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth2"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth3"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth4"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth5"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth6"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">once</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">pr</span><span class="p">;</span>
<span class="n">const</span> <span class="n">s</span> <span class="o">=</span> <span class="p">(</span> <span class="n">p</span> <span class="p">)</span> <span class="o">=></span> <span class="p">{</span>
<span class="n">pr</span> <span class="o">=</span> <span class="n">p</span><span class="p">;</span>
<span class="n">var</span> <span class="n">img</span><span class="p">;</span>
<span class="n">let</span> <span class="n">x</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">let</span> <span class="n">y</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">p</span><span class="o">.</span><span class="n">setup</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">x</span> <span class="o">=</span> <span class="n">p</span><span class="o">.</span><span class="n">createCanvas</span><span class="p">(</span><span class="mi">700</span><span class="p">,</span> <span class="mi">410</span><span class="p">);</span>
<span class="n">x</span><span class="o">.</span><span class="n">canvas</span><span class="o">.</span><span class="n">style</span><span class="o">.</span><span class="n">position</span> <span class="o">=</span> <span class="s2">"absolute"</span><span class="p">;</span>
<span class="n">p</span><span class="o">.</span><span class="n">frameRate</span><span class="p">(</span><span class="mi">30</span><span class="p">);</span>
<span class="n">img</span> <span class="o">=</span> <span class="n">p</span><span class="o">.</span><span class="n">loadImage</span><span class="p">(</span><span class="s1">'/test.png'</span><span class="p">);</span>
<span class="p">};</span>
<span class="n">p</span><span class="o">.</span><span class="n">draw</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">e</span> <span class="o">=</span> <span class="n">getRandomInt</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="n">p</span><span class="o">.</span><span class="n">clear</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="n">e</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">fill</span><span class="p">(</span><span class="mi">123</span><span class="p">);</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">rect</span><span class="p">(</span><span class="n">x</span><span class="p">,</span><span class="n">y</span><span class="p">,</span><span class="mi">50</span><span class="p">,</span><span class="mi">50</span><span class="p">);</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">image</span><span class="p">(</span><span class="n">img</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">};</span>
<span class="p">};</span>
<span class="n">let</span> <span class="n">myp5</span> <span class="o">=</span> <span class="n">new</span> <span class="n">p5</span><span class="p">(</span><span class="n">s</span><span class="p">,</span> <span class="n">document</span><span class="o">.</span><span class="n">getElementById</span><span class="p">(</span><span class="s1">'canvas-container'</span><span class="p">));</span>
<span class="n">var</span> <span class="n">visualizer</span> <span class="o">=</span> <span class="n">initWinamp</span><span class="p">(</span><span class="s2">"_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"</span><span class="p">);</span>
<span class="n">render_loop</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">visualizer</span><span class="o">.</span><span class="n">render</span><span class="p">();</span>
<span class="p">}</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="o">-</span><span class="mi">30</span><span class="p">;</span>
<span class="n">mem</span><span class="o">.</span><span class="n">master</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">Tone</span><span class="o">.</span><span class="n">Destination</span><span class="p">);</span>
<span class="o">//</span> <span class="n">NoiseSynth</span><span class="p">();</span>
<span class="n">Stab</span><span class="p">();</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"k"</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">3000</span><span class="p">,</span> <span class="mi">3</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"h"</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mi">7000</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"sn"</span><span class="p">,</span><span class="mi">2</span><span class="p">,</span> <span class="mi">6000</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"c"</span><span class="p">,</span> <span class="mi">3</span><span class="p">,</span> <span class="mi">620</span><span class="p">,</span> <span class="mi">2</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"l"</span><span class="p">,</span> <span class="mi">4</span><span class="p">,</span> <span class="mi">420</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"1"</span><span class="p">]</span> <span class="o">=</span> <span class="n">function</span> <span class="p">(</span><span class="n">val</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">val</span> <span class="o">></span> <span class="mf">0.5</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">true</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">false</span><span class="p">;</span>
<span class="p">}</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">Q</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">val</span> <span class="o">*</span> <span class="mi">5</span><span class="p">);</span>
<span class="p">}</span>
<span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span><span class="o">.</span><span class="n">onChange</span><span class="p">(</span><span class="n">function</span> <span class="p">(</span><span class="n">e</span><span class="p">)</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">val</span> <span class="o">=</span> <span class="n">parseFloat</span><span class="p">(</span><span class="n">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">]</span><span class="o">.</span><span class="n">value</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"1"</span><span class="p">](</span><span class="n">val</span><span class="p">);</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">tweak</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="o">.</span><span class="n">k1</span> <span class="o">=</span> <span class="n">knob</span><span class="p">({</span><span class="n">ramp</span> <span class="p">:</span> <span class="p">[</span><span class="mf">0.525</span><span class="p">,</span> <span class="mf">0.8</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">,</span> <span class="mf">0.75</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">,</span> <span class="mf">0.1</span><span class="p">],</span> <span class="s2">"number"</span><span class="p">:</span> <span class="n">dials</span><span class="p">[</span><span class="mi">2</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span> <span class="p">});</span>
<span class="n">always</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">mem</span><span class="o">.</span><span class="n">k1</span><span class="o">.</span><span class="n">move</span><span class="p">()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o"><=</span> <span class="mi">3</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">once</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">tweak</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">isHit</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">0</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">8</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">3</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">4</span> <span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">s</span><span class="p">();</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">==</span> <span class="mi">6</span><span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">4</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">])</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">5</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">12</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">3</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">6</span><span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="p">(</span><span class="mi">4</span><span class="p">,</span> <span class="s2">"C3"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">count</span> <span class="o">==</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"k_last"</span><span class="p">]</span> <span class="o">+</span> <span class="mi">3</span><span class="p">))</span> <span class="p">{</span>
<span class="n">pn</span><span class="p">(</span><span class="s2">"h"</span><span class="p">);</span>
<span class="p">}</span>
</pre></div>
</div>
</div>
</div>
|
| | | | < < < < < | | | > > > > > > > > > > > > | | < < < < < < < < < < > > | > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > | > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > | | > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > < < < | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | > > > > > > > > |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 ... 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070 1071 1072 1073 1074 1075 1076 1077 1078 1079 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Getting Started — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="tocsection onthispage pt-5 pb-3">
<i class="fas fa-list"></i> Contents
</div>
<nav id="bd-toc-nav">
<ul class="visible nav section-nav flex-column">
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#tutorial">
Tutorial
</a>
<ul class="nav section-nav flex-column">
<li class="toc-h3 nav-item toc-entry">
<a class="reference internal nav-link" href="#making-a-basic-loop">
Making a basic loop
</a>
</li>
<li class="toc-h3 nav-item toc-entry">
<a class="reference internal nav-link" href="#full-code">
Full Code
</a>
</li>
</ul>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#demo-song-1-techno">
Demo Song 1 // Techno
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#demo-song-2-uk-hip-hop">
Demo Song 2 // UK Hip Hop
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="getting-started">
<h1>Getting Started<a class="headerlink" href="#getting-started" title="Permalink to this headline">¶</a></h1>
<div class="section" id="tutorial">
<h2>Tutorial<a class="headerlink" href="#tutorial" title="Permalink to this headline">¶</a></h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/o683v4dt6RM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<p>This illustrates the core concepts of bitrhythm.</p>
<ol class="simple">
<li><p>Samples (Tone.Sampler)</p></li>
<li><p>Dials (use cellx internally)</p></li>
<li><p>Observers (cellx)</p></li>
</ol>
<p>See <a class="reference external" href="https://tonejs.github.io/">https://tonejs.github.io/</a> for more notes.</p>
<p>For an understanding of the global variables see the concepts and code walkthrough section.</p>
<div class="highlight-none notranslate"><div class="highlight"><pre><span></span>- patterns and track_no
- isHit, delta
- samples
- dials
- Tone
- cellx
- window and any thing included with the script tag is available here
</pre></div>
</div>
<p><code class="docutils literal notranslate"><span class="pre">mem</span></code> is short for memory. All instruments and effects are saved here so that they can be accessed everywhere.</p>
<p>Step to create the basic song.</p>
<ol class="simple">
<li><p>Click on <code class="docutils literal notranslate"><span class="pre">Add</span> <span class="pre">Sample</span> <span class="pre">URL</span></code> to add the following URLs</p>
<ul class="simple">
<li><p>/Kick01.wav</p></li>
<li><p>/Snare19.wav</p></li>
<li><p>/Closedhat01.wav</p></li>
<li><p>/MiscSynthStab04.wav</p></li>
</ul>
</li>
<li><p>Click on <code class="docutils literal notranslate"><span class="pre">Add</span> <span class="pre">Dial</span></code></p></li>
<li><p>Enter the following into the window</p></li>
</ol>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">scene1</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1000 1000 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">scene2</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1011 1001 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">patterns</span> <span class="o">=</span> <span class="n">scene1</span>
<span class="n">var</span> <span class="n">once</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="o">-</span><span class="mi">30</span>
<span class="n">mem</span><span class="o">.</span><span class="n">master</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Destination</span><span class="p">);</span>
<span class="n">mem</span><span class="o">.</span><span class="n">volume_guard</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="o">-</span><span class="mi">10</span><span class="p">]);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"k"</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"h"</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"sn"</span><span class="p">,</span> <span class="mi">2</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"ex"</span><span class="p">]</span> <span class="o">=</span> <span class="n">function</span> <span class="p">(</span><span class="n">val</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">val</span> <span class="o">></span> <span class="mf">0.5</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">true</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span><span class="o">.</span><span class="n">onChange</span><span class="p">(</span><span class="n">function</span> <span class="p">(</span><span class="n">e</span><span class="p">)</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">val</span> <span class="o">=</span> <span class="n">parseFloat</span><span class="p">(</span><span class="n">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">]</span><span class="o">.</span><span class="n">value</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"ex"</span><span class="p">](</span><span class="n">val</span><span class="p">);</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o"><=</span> <span class="mi">3</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">once</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">tweak</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">isHit</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">3</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">])</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="p">};</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p>Now try changing the code.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">patterns</span> <span class="o">=</span> <span class="n">scene2</span>
</pre></div>
</div>
<p>Increase the dial to see the addition of the snare. This is how you can use observers to trigger unrelated changes. I call them sideevents, as the logic is similar to sidechain, which typically observers the volume.</p>
<p>Comment and Uncomment lines in the <code class="docutils literal notranslate"><span class="pre">if</span> <span class="pre">(isHit)</span></code> block. To mute and unmute sections.</p>
<p><em>Note:</em> <code class="docutils literal notranslate"><span class="pre">mem["k0_channel"].solo</span> <span class="pre">=</span> <span class="pre">true;</span></code> is not working.</p>
<p><strong>Visuals</strong></p>
<p>Change the once function to this and click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Execute</span> <span class="pre">Once</span></code></p>
<p>Code is taken from butterchurn. Try changing <a class="reference external" href="https://butterchurnviz.com/">presets</a> to get different visuals.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">tweak</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">initWinamp</span><span class="p">(</span><span class="s2">"_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"</span><span class="p">);</span>
<span class="n">render_loop</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">window</span><span class="o">.</span><span class="n">visualizer</span><span class="o">.</span><span class="n">render</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p><strong>Tweaking</strong></p>
<p>First click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Number</span></code>. This is useful to check if the knob function is actually working. And click <code class="docutils literal notranslate"><span class="pre">+</span> <span class="pre">Execute</span> <span class="pre">Once</span></code></p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">tweak</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="o">.</span><span class="n">k1</span> <span class="o">=</span> <span class="n">knob</span><span class="p">({</span><span class="n">ramp</span> <span class="p">:</span> <span class="p">[</span><span class="mf">0.09</span><span class="p">,</span><span class="mf">1.8</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">,</span> <span class="mi">2</span><span class="p">,</span> <span class="mf">1.5</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.5</span><span class="p">,</span> <span class="mi">3</span><span class="p">,</span> <span class="mi">5</span><span class="p">,</span> <span class="mi">8</span><span class="p">,</span> <span class="mi">2</span><span class="p">],</span> <span class="s2">"number"</span><span class="p">:</span> <span class="n">numbers</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"v"</span><span class="p">]</span> <span class="p">});</span>
<span class="n">always</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"k0_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">mem</span><span class="o">.</span><span class="n">k1</span><span class="o">.</span><span class="n">move</span><span class="p">()</span> <span class="o">*</span> <span class="mi">1000</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
<p>As you can sere numbers and dials will be available as a global array.</p>
<p>There is no way to remove them so be careful about the order in which you add them.</p>
<p>The following code will always be executed as its at the top level. As you can see this code implies that the first dial is connected to the master volume. Use guards to avoid going deaf as someundefineds editing can created bad frequency numbers.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard</span><span class="p">((</span><span class="mi">1</span> <span class="o">-</span> <span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]())</span> <span class="o">*</span> <span class="o">-</span><span class="mi">30</span><span class="p">);</span>
</pre></div>
</div>
<div class="section" id="making-a-basic-loop">
<h3>Making a basic loop<a class="headerlink" href="#making-a-basic-loop" title="Permalink to this headline">¶</a></h3>
<ul class="simple">
<li><p>Kick + Filter</p></li>
<li><p>Snare + Filter</p></li>
<li><p>Snare + Filter + Delay</p></li>
<li><p>High Hat</p></li>
<li><p>Lead + Filter</p></li>
<li><p>Dub Stab + Filter + Reverb</p></li>
</ul>
<p>Tip: In Tone.js you can’t call connect one after another, you need to use chain.</p>
<p>TODO: Add glide to Lead to make it more 303 sounding</p>
<p>Master is connected with Surround and Volume Limiter.
Use Gates and Limiters to avoid going deaf.</p>
<p>Tone.MultiInstrument gave lots of glitches, so custom voices are written in the voice function</p>
<p>Channels provide</p>
<ul class="simple">
<li><p>Mute</p></li>
<li><p>Solo</p></li>
</ul>
<p>More improvements for the Stab</p>
<div class="highlight-none notranslate"><div class="highlight"><pre><span></span>- Chorus or Phaser
- Compressor
- Decay in envelope
- Separate filters
- EQ
- Sends for more delay
- LFO for filters
</pre></div>
</div>
<p>Freeverb does not work and also needs Mono to function properly</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">var</span> <span class="n">reverb</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Freeverb</span><span class="p">()</span><span class="o">.</span><span class="n">toDestination</span><span class="p">();</span>
<span class="n">var</span> <span class="n">reverb_mono</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Mono</span><span class="p">()</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">reverb</span><span class="p">);</span>
<span class="n">reverb</span><span class="o">.</span><span class="n">dampening</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">reverb</span><span class="o">.</span><span class="n">roomSize</span> <span class="o">=</span> <span class="mf">0.9</span><span class="p">;</span>
</pre></div>
</div>
</div>
<div class="section" id="full-code">
<h3>Full Code<a class="headerlink" href="#full-code" title="Permalink to this headline">¶</a></h3>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">volume_guard1</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard1</span><span class="p">(</span><span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">30</span><span class="p">)</span> <span class="o">-</span><span class="mi">20</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="s2">"stab_channel"</span><span class="p">]</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard2</span><span class="p">(</span><span class="o">-</span><span class="mi">2</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">);</span>
<span class="n">scene1</span> <span class="o">=</span> <span class="p">[</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 1000 1000 1000 1000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 00x0 00x0 00x0 00x0"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0x00 0000 0000 x000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p xx0x c0x0 x0x0 x0xx"</span><span class="p">),</span>
<span class="n">cellx</span><span class="p">(</span><span class="s2">"p x000 x0x0 0000 x0x0"</span><span class="p">),</span>
<span class="p">]</span>
<span class="n">patterns</span> <span class="o">=</span> <span class="n">scene1</span>
<span class="n">function</span> <span class="n">NoiseSynth</span> <span class="p">(</span><span class="n">name</span><span class="p">)</span> <span class="p">{</span>
<span class="n">name</span> <span class="o">=</span> <span class="n">name</span> <span class="o">||</span> <span class="s2">"wf"</span><span class="p">;</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">StereoWidener</span><span class="p">({</span><span class="n">width</span><span class="p">:</span> <span class="mi">1</span><span class="p">});</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Noise</span><span class="p">(</span><span class="s2">"pink"</span><span class="p">)</span><span class="o">.</span><span class="n">start</span><span class="p">();</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">400</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">,</span> <span class="n">pan</span><span class="p">:</span> <span class="o">-</span><span class="mf">0.8</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">],</span> <span class="n">mem</span><span class="o">.</span><span class="n">master</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span><span class="p">]</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">])</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">Stab</span><span class="p">(</span><span class="n">name</span><span class="p">)</span> <span class="p">{</span>
<span class="n">name</span> <span class="o">=</span> <span class="n">name</span> <span class="o">||</span> <span class="s2">"stab"</span><span class="p">;</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">5250</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_hfilter"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Filter</span><span class="p">(</span><span class="mi">80</span><span class="p">,</span> <span class="s1">'highpass'</span><span class="p">,</span> <span class="o">-</span><span class="mi">96</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_reverb"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Reverb</span><span class="p">(</span><span class="mf">0.1</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">FeedbackDelay</span><span class="p">(</span><span class="s2">"4n"</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">);</span>
<span class="o">//</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_pdelay"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">PingPongDelay</span><span class="p">(</span><span class="s2">"2n"</span><span class="p">,</span> <span class="mf">0.1</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">StereoWidener</span><span class="p">({</span><span class="n">width</span><span class="p">:</span> <span class="mf">0.25</span><span class="p">});</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">2</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="p">,</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_reverb"</span><span class="p">],</span> <span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_hfilter"</span><span class="p">]</span> <span class="p">,</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_stereo"</span><span class="p">],</span> <span class="n">mem</span><span class="o">.</span><span class="n">master</span><span class="p">)</span>
<span class="n">function</span> <span class="n">voice</span><span class="p">(</span><span class="n">no</span><span class="p">,</span> <span class="nb">type</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_synth"</span> <span class="o">+</span> <span class="n">no</span><span class="p">]</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">MonoSynth</span><span class="p">({</span>
<span class="n">oscillator</span><span class="p">:</span> <span class="p">{</span>
<span class="nb">type</span><span class="p">:</span> <span class="nb">type</span>
<span class="p">}</span>
<span class="p">})</span>
<span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_synth"</span> <span class="o">+</span> <span class="n">no</span><span class="p">]</span><span class="o">.</span><span class="n">connect</span><span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="n">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]);</span>
<span class="p">}</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">1</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">2</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">3</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">4</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">5</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="n">voice</span><span class="p">(</span><span class="mi">6</span><span class="p">,</span> <span class="s2">"pwm"</span><span class="p">)</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">s</span><span class="p">(</span><span class="n">vel</span><span class="p">,</span> <span class="n">notes</span><span class="p">,</span> <span class="n">duration</span><span class="p">)</span> <span class="p">{</span>
<span class="n">vel</span> <span class="o">=</span> <span class="n">vel</span> <span class="o">||</span> <span class="mf">1.0</span><span class="p">;</span>
<span class="n">duration</span> <span class="o">=</span> <span class="n">duration</span> <span class="o">||</span> <span class="s2">"2n"</span><span class="p">;</span>
<span class="n">notes</span> <span class="o">=</span> <span class="n">notes</span> <span class="o">||</span> <span class="p">[</span><span class="s2">"E2"</span><span class="p">,</span> <span class="s2">"B2"</span><span class="p">,</span> <span class="s2">"G2"</span><span class="p">];</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth1"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth2"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth3"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth4"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth5"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_synth6"</span><span class="p">]</span><span class="o">.</span><span class="n">triggerAttackRelease</span><span class="p">(</span><span class="n">notes</span><span class="p">[</span><span class="mi">2</span><span class="p">],</span> <span class="n">duration</span><span class="p">,</span> <span class="n">undefined</span><span class="p">,</span> <span class="n">vel</span><span class="p">);</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">once</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">pr</span><span class="p">;</span>
<span class="n">const</span> <span class="n">s</span> <span class="o">=</span> <span class="p">(</span> <span class="n">p</span> <span class="p">)</span> <span class="o">=></span> <span class="p">{</span>
<span class="n">pr</span> <span class="o">=</span> <span class="n">p</span><span class="p">;</span>
<span class="n">var</span> <span class="n">img</span><span class="p">;</span>
<span class="n">let</span> <span class="n">x</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">let</span> <span class="n">y</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="n">p</span><span class="o">.</span><span class="n">setup</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">x</span> <span class="o">=</span> <span class="n">p</span><span class="o">.</span><span class="n">createCanvas</span><span class="p">(</span><span class="mi">700</span><span class="p">,</span> <span class="mi">410</span><span class="p">);</span>
<span class="n">x</span><span class="o">.</span><span class="n">canvas</span><span class="o">.</span><span class="n">style</span><span class="o">.</span><span class="n">position</span> <span class="o">=</span> <span class="s2">"absolute"</span><span class="p">;</span>
<span class="n">p</span><span class="o">.</span><span class="n">frameRate</span><span class="p">(</span><span class="mi">30</span><span class="p">);</span>
<span class="n">img</span> <span class="o">=</span> <span class="n">p</span><span class="o">.</span><span class="n">loadImage</span><span class="p">(</span><span class="s1">'/test.png'</span><span class="p">);</span>
<span class="p">};</span>
<span class="n">p</span><span class="o">.</span><span class="n">draw</span> <span class="o">=</span> <span class="n">function</span><span class="p">()</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">e</span> <span class="o">=</span> <span class="n">getRandomInt</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="n">p</span><span class="o">.</span><span class="n">clear</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="n">e</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">fill</span><span class="p">(</span><span class="mi">123</span><span class="p">);</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">rect</span><span class="p">(</span><span class="n">x</span><span class="p">,</span><span class="n">y</span><span class="p">,</span><span class="mi">50</span><span class="p">,</span><span class="mi">50</span><span class="p">);</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="o">.</span><span class="n">image</span><span class="p">(</span><span class="n">img</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">};</span>
<span class="p">};</span>
<span class="n">let</span> <span class="n">myp5</span> <span class="o">=</span> <span class="n">new</span> <span class="n">p5</span><span class="p">(</span><span class="n">s</span><span class="p">,</span> <span class="n">document</span><span class="o">.</span><span class="n">getElementById</span><span class="p">(</span><span class="s1">'canvas-container'</span><span class="p">));</span>
<span class="n">var</span> <span class="n">visualizer</span> <span class="o">=</span> <span class="n">initWinamp</span><span class="p">(</span><span class="s2">"_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"</span><span class="p">);</span>
<span class="n">render_loop</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">visualizer</span><span class="o">.</span><span class="n">render</span><span class="p">();</span>
<span class="p">}</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="o">-</span><span class="mi">30</span><span class="p">;</span>
<span class="n">mem</span><span class="o">.</span><span class="n">master</span> <span class="o">=</span> <span class="n">new</span> <span class="n">Tone</span><span class="o">.</span><span class="n">Channel</span><span class="p">({</span><span class="n">channelCount</span><span class="p">:</span> <span class="mi">2</span><span class="p">,</span> <span class="n">volume</span><span class="p">:</span> <span class="o">-</span><span class="mi">10</span><span class="p">})</span><span class="o">.</span><span class="n">chain</span><span class="p">(</span><span class="n">Tone</span><span class="o">.</span><span class="n">Destination</span><span class="p">);</span>
<span class="o">//</span> <span class="n">NoiseSynth</span><span class="p">();</span>
<span class="n">Stab</span><span class="p">();</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"k"</span><span class="p">,</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">3000</span><span class="p">,</span> <span class="mi">3</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"h"</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mi">7000</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"sn"</span><span class="p">,</span><span class="mi">2</span><span class="p">,</span> <span class="mi">6000</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"c"</span><span class="p">,</span> <span class="mi">3</span><span class="p">,</span> <span class="mi">620</span><span class="p">,</span> <span class="mi">2</span><span class="p">);</span>
<span class="n">Sample</span><span class="p">(</span><span class="s2">"l"</span><span class="p">,</span> <span class="mi">4</span><span class="p">,</span> <span class="mi">420</span><span class="p">,</span> <span class="o">-</span><span class="mi">15</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"1"</span><span class="p">]</span> <span class="o">=</span> <span class="n">function</span> <span class="p">(</span><span class="n">val</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">val</span> <span class="o">></span> <span class="mf">0.5</span><span class="p">)</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">true</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">]</span> <span class="o">=</span> <span class="n">false</span><span class="p">;</span>
<span class="p">}</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">Q</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">val</span> <span class="o">*</span> <span class="mi">5</span><span class="p">);</span>
<span class="p">}</span>
<span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span><span class="o">.</span><span class="n">onChange</span><span class="p">(</span><span class="n">function</span> <span class="p">(</span><span class="n">e</span><span class="p">)</span> <span class="p">{</span>
<span class="n">var</span> <span class="n">val</span> <span class="o">=</span> <span class="n">parseFloat</span><span class="p">(</span><span class="n">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">]</span><span class="o">.</span><span class="n">value</span><span class="p">);</span>
<span class="n">handlers</span><span class="p">[</span><span class="s2">"1"</span><span class="p">](</span><span class="n">val</span><span class="p">);</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="n">function</span> <span class="n">tweak</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="o">.</span><span class="n">k1</span> <span class="o">=</span> <span class="n">knob</span><span class="p">({</span><span class="n">ramp</span> <span class="p">:</span> <span class="p">[</span><span class="mf">0.525</span><span class="p">,</span> <span class="mf">0.8</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">,</span> <span class="mf">0.75</span><span class="p">,</span> <span class="mi">1</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">,</span> <span class="mf">0.1</span><span class="p">],</span> <span class="s2">"number"</span><span class="p">:</span> <span class="n">dials</span><span class="p">[</span><span class="mi">2</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span> <span class="p">});</span>
<span class="n">always</span> <span class="o">=</span> <span class="n">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">mem</span><span class="o">.</span><span class="n">k1</span><span class="o">.</span><span class="n">move</span><span class="p">()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o"><=</span> <span class="mi">3</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">once</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="n">transition</span> <span class="o">=</span> <span class="n">tweak</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">isHit</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">0</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">0</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">8</span> <span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">3</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">4</span> <span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">s</span><span class="p">();</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">==</span> <span class="mi">6</span><span class="p">)</span> <span class="p">{</span>
<span class="n">transition</span><span class="p">();</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">4</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"start_snare"</span><span class="p">])</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">5</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="n">bars</span> <span class="o">></span> <span class="mi">12</span><span class="p">)</span> <span class="p">{</span>
<span class="n">p</span><span class="p">(</span><span class="mi">3</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">track_no</span> <span class="o">==</span> <span class="mi">6</span><span class="p">)</span> <span class="p">{</span>
<span class="o">//</span> <span class="n">p</span><span class="p">(</span><span class="mi">4</span><span class="p">,</span> <span class="s2">"C3"</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="n">count</span> <span class="o">==</span> <span class="p">(</span><span class="n">mem</span><span class="p">[</span><span class="s2">"k_last"</span><span class="p">]</span> <span class="o">+</span> <span class="mi">3</span><span class="p">))</span> <span class="p">{</span>
<span class="n">pn</span><span class="p">(</span><span class="s2">"h"</span><span class="p">);</span>
<span class="p">}</span>
</pre></div>
</div>
</div>
</div>
<div class="section" id="demo-song-1-techno">
<h2>Demo Song 1 // Techno<a class="headerlink" href="#demo-song-1-techno" title="Permalink to this headline">¶</a></h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/GTfmTMrSpag" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<p>Postprocessed using Reaper with EQ and Surround effects to add some sparkle.
Video is recorded with the help of Blackhole and Kap and rendered by Reaper.</p>
<p>Samples taken from Deep Techno and Dub Techno collections from splice. Sadly I can’t distribute the song itself as I would also have to distribute the samples with it.</p>
<p>Code for the Demo Song. The visualisation was disabled in the Demo as it was causing a huge lag while recording on both windows and mac.</p>
<p>Note: Could could be outdated due to latest changes to the API.</p>
<div class="highlight-default notranslate"><div class="highlight"><pre><span></span><span class="n">volume_guard1</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">volume_guard2</span> <span class="o">=</span> <span class="n">guard</span><span class="p">([</span><span class="o">-</span><span class="mi">20</span><span class="p">,</span><span class="mi">15</span><span class="p">])</span>
<span class="n">Tone</span><span class="o">.</span><span class="n">Master</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard1</span><span class="p">(</span><span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">30</span><span class="p">)</span> <span class="o">-</span><span class="mi">20</span><span class="p">);</span>
<span class="o">//</span><span class="n">mem</span><span class="p">[</span><span class="s2">"stab_channel"</span><span class="p">]</span><span class="o">.</span><span class="n">volume</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">volume_guard2</span><span class="p">(</span><span class="o">-</span><span class="mi">2</span><span class="p">);</span>
<span class="o">//</span><span class="n">mem</span><span class="p">[</span><span class="s2">"stab_filter"</span><span class="p">]</span><span class="o">.</span><span class="n">frequency</span><span class="o">.</span><span class="n">value</span> <span class="o">=</span> <span class="n">Math</span><span class="o">.</span><span class="n">round</span><span class="p">(</span><span class="n">dials</span><span class="p">[</span><span class="mi">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mi">10000</span><span class="p">);</span>
................................................................................
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
</div>
<div class="section" id="demo-song-2-uk-hip-hop">
<h2>Demo Song 2 // UK Hip Hop<a class="headerlink" href="#demo-song-2-uk-hip-hop" title="Permalink to this headline">¶</a></h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/9eaABgJJlUo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="highlight-js notranslate"><div class="highlight"><pre><span></span><span class="nx">volume_guard1</span> <span class="o">=</span> <span class="nx">guard</span><span class="p">([</span><span class="o">-</span><span class="mf">20</span><span class="p">,</span><span class="mf">15</span><span class="p">])</span>
<span class="nx">Tone</span><span class="p">.</span><span class="nx">Master</span><span class="p">.</span><span class="nx">volume</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">volume_guard1</span><span class="p">(</span><span class="nb">Math</span><span class="p">.</span><span class="nx">round</span><span class="p">(</span><span class="nx">dials</span><span class="p">[</span><span class="mf">0</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]()</span> <span class="o">*</span> <span class="mf">30</span><span class="p">)</span> <span class="o">-</span><span class="mf">20</span><span class="p">);</span>
<span class="nx">intro</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x000 0000 0000 0000 "</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">main</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x0x0 x0x0 x0x0 x0x0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x000 0000 0000 0000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">bass</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x0x0 x0x0 x0x0 x0x0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x000 0000 0000 0000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[^B2]x.00 x[^B2]x.x[^B2]x. x[^B2]x.x[^B2]x.x[^B2]x.0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 00x[^D3]0 000x[^A2] 00x[^A2]x[^A2] 0x[^A2]0x[^A2] "</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">end</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x10x0 x0x0 x0x0 x0x0 "</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">solo</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">fin</span> <span class="o">=</span> <span class="nx">solo</span><span class="p">;</span>
<span class="nx">endgame</span> <span class="o">=</span> <span class="p">[</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 x000 0000 x000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x0x0 x0x0 x0x0 x0x0 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x000 0000 0000 0000 "</span><span class="p">),</span>
<span class="nx">cellx</span><span class="p">(</span><span class="s2">"p x[^B2]x.00 x[^B2]x.x[^B2]x. x[^B2]x.x[^B2]x.x[^B2]x.0 "</span><span class="p">),</span>
<span class="p">]</span>
<span class="nx">empty</span> <span class="o">=</span> <span class="nx">cellx</span><span class="p">(</span><span class="s2">"p 0000 0000 0000 0000"</span><span class="p">)</span>
<span class="kd">function</span> <span class="nx">once</span> <span class="p">()</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">setup</span> <span class="o">=</span> <span class="p">(</span> <span class="nx">instance</span> <span class="p">)</span> <span class="p">=></span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">intro</span> <span class="o">=</span> <span class="p">[]</span>
<span class="kd">var</span> <span class="nx">main</span> <span class="o">=</span> <span class="p">[]</span>
<span class="kd">var</span> <span class="nx">bass</span> <span class="o">=</span> <span class="nx">main</span>
<span class="kd">var</span> <span class="nx">end</span> <span class="o">=</span> <span class="p">[]</span>
<span class="kd">var</span> <span class="nx">solo</span> <span class="o">=</span> <span class="nx">end</span>
<span class="kd">var</span> <span class="nx">fin</span> <span class="o">=</span> <span class="nx">end</span>
<span class="kd">var</span> <span class="nx">count</span> <span class="o">=</span> <span class="mf">0</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">old_scene</span> <span class="o">=</span> <span class="s2">""</span><span class="p">;</span>
<span class="kd">let</span> <span class="nx">x</span> <span class="o">=</span> <span class="mf">100</span><span class="p">;</span>
<span class="kd">let</span> <span class="nx">y</span> <span class="o">=</span> <span class="mf">100</span><span class="p">;</span>
<span class="nx">instance</span><span class="p">.</span><span class="nx">setup</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">x</span> <span class="o">=</span> <span class="nx">instance</span><span class="p">.</span><span class="nx">createCanvas</span><span class="p">(</span><span class="mf">1280</span><span class="p">,</span> <span class="mf">410</span><span class="p">);</span>
<span class="nx">x</span><span class="p">.</span><span class="nx">canvas</span><span class="p">.</span><span class="nx">style</span><span class="p">.</span><span class="nx">position</span> <span class="o">=</span> <span class="s2">"absolute"</span><span class="p">;</span>
<span class="nx">instance</span><span class="p">.</span><span class="nx">frameRate</span><span class="p">(</span><span class="mf">0.25</span><span class="p">);</span>
<span class="nx">intro</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/intro/1.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/1.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/2.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/3.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/4.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/5.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/6.png'</span><span class="p">));</span>
<span class="nx">main</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/main/7.png'</span><span class="p">));</span>
<span class="nx">end</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">instance</span><span class="p">.</span><span class="nx">loadImage</span><span class="p">(</span><span class="s1">'/closed/end/1.png'</span><span class="p">));</span>
<span class="p">};</span>
<span class="nx">instance</span><span class="p">.</span><span class="nx">draw</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">old_scene</span> <span class="o">!=</span> <span class="nx">current_scene</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">old_scene</span> <span class="o">=</span> <span class="nx">current_scene</span><span class="p">;</span>
<span class="nx">count</span> <span class="o">=</span> <span class="mf">0</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">instance</span><span class="p">.</span><span class="nx">clear</span><span class="p">();</span>
<span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="nb">eval</span><span class="p">(</span><span class="sb">`</span><span class="si">${</span><span class="nx">current_scene</span><span class="si">}</span><span class="sb">`</span><span class="p">)</span>
<span class="nx">instance</span><span class="p">.</span><span class="nx">image</span><span class="p">(</span><span class="nx">c</span><span class="p">[</span><span class="nx">count</span><span class="p">],</span> <span class="mf">0</span><span class="p">,</span> <span class="mf">0</span><span class="p">);</span>
<span class="nx">count</span> <span class="o">+=</span> <span class="mf">1</span>
<span class="nx">count</span> <span class="o">=</span> <span class="nx">count</span> <span class="o">%</span> <span class="nx">c</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
<span class="p">};</span>
<span class="p">};</span>
<span class="kd">let</span> <span class="nx">myp5</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">p5</span><span class="p">(</span><span class="nx">setup</span><span class="p">,</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s1">'canvas-container'</span><span class="p">));</span>
<span class="nx">Tone</span><span class="p">.</span><span class="nx">Master</span><span class="p">.</span><span class="nx">volume</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="o">-</span><span class="mf">30</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">2</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">](</span><span class="mf">1</span><span class="p">)</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"master_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">Filter</span><span class="p">(</span><span class="mf">10000</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mf">96</span><span class="p">);</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"master_stereo"</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">StereoWidener</span><span class="p">({</span><span class="nx">width</span><span class="o">:</span> <span class="mf">0.50</span><span class="p">});</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">2</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">].</span><span class="nx">onChange</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">].</span><span class="nx">value</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">cutoff_guard</span> <span class="o">=</span> <span class="nx">guard</span><span class="p">([</span><span class="mf">10</span><span class="p">,</span> <span class="mf">20000</span><span class="p">]);</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"master_filter"</span><span class="p">].</span><span class="nx">frequency</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">cutoff_guard</span><span class="p">(</span><span class="nx">val</span> <span class="o">*</span> <span class="mf">10000</span><span class="p">);</span>
<span class="p">})</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">3</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">](</span><span class="mf">0</span><span class="p">)</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">3</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">].</span><span class="nx">onChange</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">].</span><span class="nx">value</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">volume_guard1</span> <span class="o">=</span> <span class="nx">guard</span><span class="p">([</span><span class="mf">0</span><span class="p">,</span><span class="mf">1</span><span class="p">])</span>
<span class="nx">audio</span><span class="p">.</span><span class="nx">master</span><span class="p">.</span><span class="k">in</span><span class="p">.</span><span class="nx">gain</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">volume_guard1</span><span class="p">(</span><span class="nx">val</span> <span class="o">/</span> <span class="mf">10</span><span class="p">);</span>
<span class="p">})</span>
<span class="nx">mem</span><span class="p">.</span><span class="nx">master</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">Channel</span><span class="p">({</span><span class="nx">channelCount</span><span class="o">:</span> <span class="mf">2</span><span class="p">,</span> <span class="nx">volume</span><span class="o">:</span> <span class="o">-</span><span class="mf">10</span><span class="p">}).</span><span class="nx">chain</span><span class="p">(</span> <span class="nx">mem</span><span class="p">[</span><span class="s2">"master_filter"</span><span class="p">],</span> <span class="nx">mem</span><span class="p">[</span><span class="s2">"master_stereo"</span><span class="p">],</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">Destination</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"k"</span><span class="p">,</span> <span class="mf">0</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">5</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"sn1"</span><span class="p">,</span><span class="mf">1</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="mf">0</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"h"</span><span class="p">,</span><span class="mf">2</span><span class="p">,</span> <span class="mf">5000</span><span class="p">,</span> <span class="o">-</span><span class="mf">35</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"m"</span><span class="p">,</span><span class="mf">3</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">15</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"f"</span><span class="p">,</span><span class="mf">4</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">15</span><span class="p">);</span>
<span class="nx">name</span> <span class="o">=</span> <span class="s2">"s"</span>
<span class="nx">filter</span> <span class="o">=</span> <span class="mf">2000</span>
<span class="nx">volume</span> <span class="o">=</span> <span class="o">-</span><span class="mf">15</span>
<span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">Filter</span><span class="p">(</span><span class="nx">filter</span><span class="p">,</span> <span class="s1">'lowpass'</span><span class="p">,</span> <span class="o">-</span><span class="mf">96</span><span class="p">);</span>
<span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">FeedbackDelay</span><span class="p">(</span><span class="s2">"4n"</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">);</span>
<span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Tone</span><span class="p">.</span><span class="nx">Channel</span><span class="p">({</span><span class="nx">channelCount</span><span class="o">:</span> <span class="mf">2</span><span class="p">,</span> <span class="nx">volume</span><span class="o">:</span> <span class="nx">volume</span><span class="p">,</span> <span class="nx">pan</span><span class="o">:</span> <span class="o">-</span><span class="mf">0.25</span><span class="p">}).</span><span class="nx">chain</span><span class="p">(</span><span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_filter"</span><span class="p">],</span> <span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_delay"</span><span class="p">],</span> <span class="nx">mem</span><span class="p">.</span><span class="nx">master</span><span class="p">)</span>
<span class="nx">samples</span><span class="p">[</span><span class="mf">5</span><span class="p">].</span><span class="nx">connect</span><span class="p">(</span><span class="nx">mem</span><span class="p">[</span><span class="nx">name</span> <span class="o">+</span> <span class="s2">"_channel"</span><span class="p">]);</span>
<span class="nx">hit_map</span><span class="p">[</span><span class="nx">name</span><span class="p">]</span> <span class="o">=</span> <span class="mf">5</span><span class="p">;</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"manager"</span><span class="p">,</span><span class="mf">6</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">5</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"order"</span><span class="p">,</span><span class="mf">7</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">15</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"cr"</span><span class="p">,</span><span class="mf">8</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="o">-</span><span class="mf">15</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"piano"</span><span class="p">,</span><span class="mf">9</span><span class="p">,</span> <span class="mf">400</span><span class="p">,</span> <span class="o">-</span><span class="mf">5</span><span class="p">);</span>
<span class="nx">Sample</span><span class="p">(</span><span class="s2">"sitar"</span><span class="p">,</span><span class="mf">10</span><span class="p">,</span> <span class="mf">5000</span><span class="p">,</span> <span class="o">-</span><span class="mf">15</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">audio</span> <span class="o">=</span> <span class="nx">Audio</span><span class="p">();</span>
<span class="kd">const</span> <span class="nx">three</span> <span class="o">=</span> <span class="nx">ThreeOhUnit</span><span class="p">(</span><span class="nx">audio</span><span class="p">,</span> <span class="s2">"sawtooth"</span><span class="p">,</span> <span class="p">{</span>
<span class="s2">"cutoff"</span><span class="o">:</span> <span class="mf">78</span><span class="p">,</span>
<span class="s2">"resonance"</span><span class="o">:</span> <span class="mf">15</span><span class="p">,</span>
<span class="s2">"envMod"</span><span class="o">:</span> <span class="mf">4000</span><span class="p">,</span>
<span class="s2">"decay"</span><span class="o">:</span> <span class="mf">0.5</span>
<span class="p">}</span>
<span class="p">)</span>
<span class="nx">audio</span><span class="p">.</span><span class="nx">master</span><span class="p">.</span><span class="k">in</span><span class="p">.</span><span class="nx">gain</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="mf">0</span><span class="p">;</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"three"</span><span class="p">]</span> <span class="o">=</span> <span class="nx">three</span>
<span class="c1">// cutoff [30, 700], 400</span>
<span class="c1">// resonance: [1, 30], 15</span>
<span class="c1">// envMod: [0, 8000], 4000</span>
<span class="c1">// decay: [0.1, 0.9], 0.5</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">](</span><span class="mf">0.07825</span><span class="p">)</span>
<span class="nx">dials</span><span class="p">[</span><span class="mf">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">].</span><span class="nx">onChange</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">].</span><span class="nx">value</span><span class="p">);</span>
<span class="nx">cutoff_guard</span> <span class="o">=</span> <span class="nx">guard</span><span class="p">([</span><span class="mf">30</span><span class="p">,</span> <span class="mf">700</span><span class="p">]);</span>
<span class="nx">three</span><span class="p">.</span><span class="nx">params</span><span class="p">.</span><span class="nx">cutoff</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">cutoff_guard</span><span class="p">(</span><span class="nx">val</span> <span class="o">*</span> <span class="mf">1000</span><span class="p">);</span>
<span class="p">})</span>
<span class="nx">mem</span><span class="p">.</span><span class="nx">k1</span> <span class="o">=</span> <span class="nx">knob</span><span class="p">({</span><span class="nx">ramp</span> <span class="o">:</span> <span class="p">[</span><span class="mf">0.525</span><span class="p">,</span> <span class="mf">0.8</span><span class="p">,</span> <span class="mf">0.4</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">,</span> <span class="mf">0.75</span><span class="p">,</span> <span class="mf">0.25</span><span class="p">],</span> <span class="nx">step</span><span class="o">:</span> <span class="mf">0.005</span><span class="p">,</span> <span class="s2">"number"</span><span class="o">:</span> <span class="nx">dials</span><span class="p">[</span><span class="mf">1</span><span class="p">][</span><span class="s2">"cell"</span><span class="p">]</span> <span class="p">});</span>
<span class="nx">always</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="kd">let</span> <span class="nx">cutoff_guard</span> <span class="o">=</span> <span class="nx">guard</span><span class="p">([</span><span class="mf">30</span><span class="p">,</span> <span class="mf">900</span><span class="p">]);</span>
<span class="nx">three</span><span class="p">.</span><span class="nx">params</span><span class="p">.</span><span class="nx">cutoff</span><span class="p">.</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">cutoff_guard</span><span class="p">(</span><span class="nx">mem</span><span class="p">.</span><span class="nx">k1</span><span class="p">.</span><span class="nx">move</span><span class="p">()</span> <span class="o">*</span> <span class="mf">1000</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kd">function</span> <span class="nx">tweak</span><span class="p">()</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">snare_count</span> <span class="o">=</span> <span class="nx">cellx</span><span class="p">(</span><span class="mf">0</span><span class="p">);</span>
<span class="nx">snare_count</span><span class="p">.</span><span class="nx">onChange</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="s2">"data"</span><span class="p">].</span><span class="nx">value</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">val</span> <span class="o">==</span> <span class="mf">22</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"fin"</span><span class="p">;</span>
<span class="nx">p1</span><span class="p">(</span><span class="mf">8</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="mf">12.25</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">})</span>
<span class="nx">Mousetrap</span><span class="p">.</span><span class="nx">bind</span><span class="p">([</span><span class="s1">'f2'</span><span class="p">],</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">snare_count</span><span class="p">(</span><span class="nx">snare_count</span><span class="p">()</span> <span class="o">+</span> <span class="mf">1</span><span class="p">)</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">snare_count</span><span class="p">()</span> <span class="o"><=</span> <span class="mf">20</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">0</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="s2">"24n"</span><span class="p">,</span> <span class="kc">null</span> <span class="p">);</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">8</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="s2">"2n"</span> <span class="p">);</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">10</span><span class="p">,</span> <span class="mf">0.5</span><span class="p">,</span> <span class="s2">"A2"</span><span class="p">,</span> <span class="mf">1</span><span class="p">);</span>
<span class="p">},</span> <span class="nx">delta</span> <span class="o">*</span> <span class="mf">2</span><span class="p">)</span>
<span class="p">},</span> <span class="nx">delta</span> <span class="o">*</span> <span class="mf">1.5</span><span class="p">)</span>
<span class="p">}</span>
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="nx">transition</span> <span class="o">=</span> <span class="nx">once</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o"><=</span> <span class="mf">2</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"intro"</span><span class="p">;</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="c1">// mem["three"].step("off");</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">3</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span> <span class="nx">cue</span><span class="p">(</span><span class="s2">"Start intro"</span><span class="p">)</span> <span class="o">:</span> <span class="s2">""</span><span class="p">;</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"intro"</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">5</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span> <span class="nx">cue</span><span class="p">(</span><span class="s2">"Start drums"</span><span class="p">)</span> <span class="o">:</span> <span class="s2">""</span><span class="p">;</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"main"</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">12</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span> <span class="nx">cue</span><span class="p">(</span><span class="s2">"Add bass"</span><span class="p">)</span><span class="o">:</span> <span class="s2">""</span><span class="p">;</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"bass"</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">32</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span><span class="nx">cue</span><span class="p">(</span><span class="s2">"Reverse "</span><span class="p">)</span><span class="o">:</span> <span class="s2">""</span><span class="p">;</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"bass"</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">42</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span> <span class="nx">cue</span><span class="p">(</span><span class="s2">"End "</span><span class="p">)</span><span class="o">:</span> <span class="s2">""</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"end"</span><span class="p">;</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">bars</span> <span class="o">==</span> <span class="mf">48</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">eval_guard</span> <span class="o">?</span> <span class="nx">cue</span><span class="p">(</span><span class="s2">"Solo "</span><span class="p">)</span><span class="o">:</span> <span class="s2">""</span>
<span class="nx">current_scene</span> <span class="o">=</span> <span class="s2">"solo"</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">transition</span> <span class="o">=</span> <span class="nx">tweak</span><span class="p">;</span>
<span class="p">}</span>
<span class="nx">patterns</span> <span class="o">=</span> <span class="nb">eval</span><span class="p">(</span><span class="sb">`</span><span class="si">${</span><span class="nx">current_scene</span><span class="si">}</span><span class="sb">`</span><span class="p">);</span>
<span class="nx">always</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">1</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">count</span> <span class="o">==</span> <span class="mf">0</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">cue</span><span class="p">(</span><span class="s2">"Sample"</span><span class="p">)</span>
<span class="nx">p1</span><span class="p">(</span><span class="mf">7</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="mf">12.25</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">isHit</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"intro"</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">1</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">3</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="s2">"1n"</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"fin"</span><span class="p">)</span> <span class="p">{</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"solo"</span><span class="p">)</span> <span class="p">{</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"end"</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">1</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">0</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"volume"</span><span class="p">],</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">],</span> <span class="s2">"24n"</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"delay"</span><span class="p">]</span> <span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">2</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">3</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">2</span><span class="p">)</span>
<span class="p">}</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"main"</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">1</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">0</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"volume"</span><span class="p">],</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">],</span> <span class="s2">"24n"</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"delay"</span><span class="p">]</span> <span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">2</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">3</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">2</span><span class="p">)</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">4</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">3</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="s2">"1n"</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">5</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">])</span> <span class="p">{</span>
<span class="c1">// mem["three"].step({"glide": true, "accent": false, "note": meta[tick]["pitch"]});</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="c1">// mem["three"].step("off");</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">6</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">5</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">],</span> <span class="s2">"1n"</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">current_scene</span> <span class="o">==</span> <span class="s2">"bass"</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">1</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">0</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"volume"</span><span class="p">],</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">],</span> <span class="s2">"24n"</span><span class="p">,</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"delay"</span><span class="p">]</span> <span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">2</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">1</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">3</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">2</span><span class="p">)</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">4</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">p</span><span class="p">(</span><span class="mf">3</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="kc">null</span><span class="p">,</span> <span class="s2">"1n"</span><span class="p">);</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">5</span><span class="p">)</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">])</span> <span class="p">{</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"three"</span><span class="p">].</span><span class="nx">step</span><span class="p">({</span><span class="s2">"glide"</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span> <span class="s2">"accent"</span><span class="o">:</span> <span class="kc">false</span><span class="p">,</span> <span class="s2">"note"</span><span class="o">:</span> <span class="nx">meta</span><span class="p">[</span><span class="nx">tick</span><span class="p">][</span><span class="s2">"pitch"</span><span class="p">]});</span>
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="nx">mem</span><span class="p">[</span><span class="s2">"three"</span><span class="p">].</span><span class="nx">step</span><span class="p">(</span><span class="s2">"off"</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">track_no</span> <span class="o">==</span> <span class="mf">6</span><span class="p">)</span> <span class="p">{</span>
<span class="c1">// p(5, 0.15, meta[tick]["pitch"], 1);</span>
<span class="c1">// p(9, 1, meta[tick]["pitch"], 1);</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
</pre></div>
</div>
</div>
</div>
|
Changes to build/html/early-attempts.html.
33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 |
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Changelog" href="changelog.html" />
<link rel="prev" title="What exactly is Tweaking ?" href="tweaking.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="tweaking.html" title="previous page">What exactly is Tweaking ?</a>
<a class='right-next' id="next-link" href="changelog.html" title="next page">Changelog</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
| | | | < < < < < | | |
33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 |
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Changelog" href="changelog.html" />
<link rel="prev" title="Core Features" href="tweaking.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="tweaking.html" title="previous page">Core Features</a>
<a class='right-next' id="next-link" href="changelog.html" title="next page">Changelog</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
Changes to build/html/genindex.html.
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
..
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="saving.html"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
|
|
|
<
<
<
<
<
|
|
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
..
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Getting Started </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> Core Features </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Saving and other limitations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
Changes to build/html/index.html.
77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 ... 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 ... 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 ... 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 |
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="saving.html"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> ................................................................................ <div class="section" id="welcome-to-bitrhythm-s-documentation"> <h1>Welcome to Bitrhythm’s documentation!<a class="headerlink" href="#welcome-to-bitrhythm-s-documentation" title="Permalink to this headline">¶</a></h1> <div class="toctree-wrapper compound"> <p class="caption"><span class="caption-text">Table of Contents</span></p> <ul> <li class="toctree-l1"><a class="reference internal" href="what.html">What is bitrhythm about ?</a><ul> <li class="toctree-l2"><a class="reference internal" href="what.html#about-author">About Author</a></li> <li class="toctree-l2"><a class="reference internal" href="what.html#support-this-project">Support this project</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="source-code.html">Source Code and License</a></li> <li class="toctree-l1"><a class="reference internal" href="demo.html">Demo and Tutorial</a><ul> <li class="toctree-l2"><a class="reference internal" href="demo.html#video">Video</a></li> <li class="toctree-l2"><a class="reference internal" href="demo.html#demo-song-1-techno">Demo Song 1 // Techno</a></li> <li class="toctree-l2"><a class="reference internal" href="demo.html#getting-started">Getting Started</a></li> <li class="toctree-l2"><a class="reference internal" href="demo.html#tutorial">Tutorial</a></li> <li class="toctree-l2"><a class="reference internal" href="demo.html#full-code">Full Code</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="samples.html">Samples</a></li> <li class="toctree-l1"><a class="reference internal" href="tweaking.html">What exactly is Tweaking ?</a><ul> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#is-bitrhythm-maths-heavy">Is Bitrhythm Maths heavy ?</a></li> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#dj-controls">DJ Controls</a></li> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#music-is-arrangement">Music is arrangement</a></li> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#see-also">See Also</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="early-attempts.html">Early Attempts</a></li> <li class="toctree-l1"><a class="reference internal" href="changelog.html">Changelog</a></li> <li class="toctree-l1"><a class="reference internal" href="main.html">Concepts and Code Walkthrough</a><ul> <li class="toctree-l2"><a class="reference internal" href="main.html#core-tracker-loop">Core Tracker Loop</a><ul> <li class="toctree-l3"><a class="reference internal" href="main.html#observers">Observers</a></li> </ul> </li> <li class="toctree-l2"><a class="reference internal" href="main.html#dials">Dials</a></li> <li class="toctree-l2"><a class="reference internal" href="main.html#numbers">Numbers</a></li> <li class="toctree-l2"><a class="reference internal" href="main.html#autoknob">AutoKnob</a></li> ................................................................................ <li class="toctree-l2"><a class="reference internal" href="main.html#autocommit">Autocommit</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="alternate-implementation.html">Alternate Implementations</a><ul> <li class="toctree-l2"><a class="reference internal" href="alternate-implementation.html#elementary">Elementary</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="saving.html">Saving and Sharing</a></li> <li class="toctree-l1"><a class="reference internal" href="limitations.html">Limitations and Recording</a></li> <li class="toctree-l1"><a class="reference internal" href="credits.html">Credits</a></li> <li class="toctree-l1"><a class="reference internal" href="bookmarks.html">Bookmarks</a><ul> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#webaudio">WebAudio</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#obsevers">Obsevers</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#visuals">Visuals</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#misc">Misc</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#other-projects">Other Projects</a></li> |
| | | < < < < < | | > | | | | > > | | | < | | | | < | |
77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 ... 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 ... 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 ... 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 |
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Getting Started </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> Core Features </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Saving and other limitations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> ................................................................................ <div class="section" id="welcome-to-bitrhythm-s-documentation"> <h1>Welcome to Bitrhythm’s documentation!<a class="headerlink" href="#welcome-to-bitrhythm-s-documentation" title="Permalink to this headline">¶</a></h1> <div class="toctree-wrapper compound"> <p class="caption"><span class="caption-text">Table of Contents</span></p> <ul> <li class="toctree-l1"><a class="reference internal" href="what.html">What is bitrhythm about ?</a><ul> <li class="toctree-l2"><a class="reference internal" href="what.html#adc-2021">ADC 2021</a></li> <li class="toctree-l2"><a class="reference internal" href="what.html#inspiration-for-the-project">Inspiration for the project</a></li> <li class="toctree-l2"><a class="reference internal" href="what.html#support-this-project">Support this project</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="source-code.html">Source Code and License</a></li> <li class="toctree-l1"><a class="reference internal" href="demo.html">Getting Started</a><ul> <li class="toctree-l2"><a class="reference internal" href="demo.html#tutorial">Tutorial</a><ul> <li class="toctree-l3"><a class="reference internal" href="demo.html#making-a-basic-loop">Making a basic loop</a></li> <li class="toctree-l3"><a class="reference internal" href="demo.html#full-code">Full Code</a></li> </ul> </li> <li class="toctree-l2"><a class="reference internal" href="demo.html#demo-song-1-techno">Demo Song 1 // Techno</a></li> <li class="toctree-l2"><a class="reference internal" href="demo.html#demo-song-2-uk-hip-hop">Demo Song 2 // UK Hip Hop</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="samples.html">Samples</a></li> <li class="toctree-l1"><a class="reference internal" href="tweaking.html">Core Features</a><ul> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#sequencer-notation">Sequencer Notation</a></li> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#tweaking-and-transitions">Tweaking and Transitions</a></li> <li class="toctree-l2"><a class="reference internal" href="tweaking.html#is-bitrhythm-maths-heavy">Is Bitrhythm Maths heavy ?</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="early-attempts.html">Early Attempts</a></li> <li class="toctree-l1"><a class="reference internal" href="changelog.html">Changelog</a></li> <li class="toctree-l1"><a class="reference internal" href="main.html">Code Walkthrough</a><ul> <li class="toctree-l2"><a class="reference internal" href="main.html#core-tracker-loop">Core Tracker Loop</a><ul> <li class="toctree-l3"><a class="reference internal" href="main.html#observers">Observers</a></li> </ul> </li> <li class="toctree-l2"><a class="reference internal" href="main.html#dials">Dials</a></li> <li class="toctree-l2"><a class="reference internal" href="main.html#numbers">Numbers</a></li> <li class="toctree-l2"><a class="reference internal" href="main.html#autoknob">AutoKnob</a></li> ................................................................................ <li class="toctree-l2"><a class="reference internal" href="main.html#autocommit">Autocommit</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="alternate-implementation.html">Alternate Implementations</a><ul> <li class="toctree-l2"><a class="reference internal" href="alternate-implementation.html#elementary">Elementary</a></li> </ul> </li> <li class="toctree-l1"><a class="reference internal" href="limitations.html">Saving and other limitations</a></li> <li class="toctree-l1"><a class="reference internal" href="credits.html">Credits</a></li> <li class="toctree-l1"><a class="reference internal" href="bookmarks.html">Bookmarks</a><ul> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#webaudio">WebAudio</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#obsevers">Obsevers</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#visuals">Visuals</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#misc">Misc</a></li> <li class="toctree-l2"><a class="reference internal" href="bookmarks.html#other-projects">Other Projects</a></li> |
Changes to build/html/limitations.html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 ... 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Limitations and Recording — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Credits" href="credits.html" />
<link rel="prev" title="Saving and Sharing" href="saving.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="limitations-and-recording">
<h1>Limitations and Recording<a class="headerlink" href="#limitations-and-recording" title="Permalink to this headline">¶</a></h1>
<ul class="simple">
<li><p>Opening developer tools might slow down the execution a bit</p></li>
<li><p>Using excessive delays and reverbs seems to cause some glitches</p></li>
<li><p>Mobile browsers don’t work properly</p></li>
<li><p>Firefox does not seem to work well with tone.js</p></li>
</ul>
<p>I use <a class="reference external" href="https://existential.audio/blackhole/">BlackHole</a> to record audio from the browser window to Reaper. You can use any screenrecording software to record the screen. Have a distinct sound to match both audio and video.</p>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="saving.html" title="previous page">Saving and Sharing</a>
<a class='right-next' id="next-link" href="credits.html" title="next page">Credits</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
| | | | | < < < < < | | | > > | |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 ... 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Saving and other limitations — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Credits" href="credits.html" />
<link rel="prev" title="Alternate Implementations" href="alternate-implementation.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="saving-and-other-limitations">
<h1>Saving and other limitations<a class="headerlink" href="#saving-and-other-limitations" title="Permalink to this headline">¶</a></h1>
<p>There is a save button that converts the state of bitrhythm into a url paramter. This means there is an upper limit on how much code you can write, making it useful for demoscene like situations. You can share the url with tinyurl.</p>
<p>You can also download the file. Please keep a backup.</p>
<ul class="simple">
<li><p>Opening developer tools might slow down the execution a bit</p></li>
<li><p>Using excessive delays and reverbs seems to cause some glitches</p></li>
<li><p>Mobile browsers don’t work properly</p></li>
<li><p>Firefox does not seem to work well with tone.js</p></li>
</ul>
<p>I use <a class="reference external" href="https://existential.audio/blackhole/">BlackHole</a> to record audio from the browser window to Reaper. You can use any screenrecording software to record the screen. Have a distinct sound to match both audio and video.</p>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="alternate-implementation.html" title="previous page">Alternate Implementations</a>
<a class='right-next' id="next-link" href="credits.html" title="next page">Credits</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
|
Changes to build/html/main.html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 .... 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 1104 1105 1106 1107 1108 .... 1297 1298 1299 1300 1301 1302 1303 1304 1305 1306 1307 1308 1309 1310 1311 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Concepts and Code Walkthrough — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="concepts-and-code-walkthrough">
<h1>Concepts and Code Walkthrough<a class="headerlink" href="#concepts-and-code-walkthrough" title="Permalink to this headline">¶</a></h1>
<div class="section" id="core-tracker-loop">
<h2>Core Tracker Loop<a class="headerlink" href="#core-tracker-loop" title="Permalink to this headline">¶</a></h2>
<p>In bitrhythm code is evaluated for every cycle.</p>
<p>1 beat = 60 / tempo
1 cycle = 1 beat / ticks</p>
<p>For every cycle visual and audio code is evaluated.</p>
<p>The edit checkbox allows you to perform long edits, where only old code is evaluated. Once you disable it, all the new edit changes are applied in the next cycle.</p>
................................................................................
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">state</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kd">function</span> <span class="nx">romantogypsy</span><span class="p">(</span><span class="nx">hex</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">letters</span> <span class="o">=</span> <span class="nx">hex</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`1'</span><span class="p">,</span><span class="s1">'a'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`2'</span><span class="p">,</span><span class="s1">'b'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`3'</span><span class="p">,</span><span class="s1">'c'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`4'</span><span class="p">,</span><span class="s1">'d'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`5'</span><span class="p">,</span><span class="s1">'e'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`6'</span><span class="p">,</span><span class="s1">'f'</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">letters</span><span class="p">;</span>
<span class="p">}</span>
<span class="kd">function</span> <span class="nx">lettertodec</span><span class="p">(</span><span class="nx">letter</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">bin</span> <span class="o">=</span> <span class="s2">""</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">letter</span><span class="p">.</span><span class="nx">match</span><span class="p">(</span><span class="sr">/\d/</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">no</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">letter</span><span class="p">);</span>
................................................................................
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">meta</span><span class="p">;</span>
<span class="p">}</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">pattern_meta</span> <span class="o">=</span> <span class="nx">pattern_meta</span><span class="p">;</span>
<span class="kd">function</span> <span class="nx">cue</span><span class="p">(</span><span class="nx">html</span><span class="p">,</span> <span class="nx">seconds</span> <span class="o">=</span> <span class="mf">5</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="s2">"#cued"</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">html</span><span class="p">);</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="s2">"#cued"</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="s2">""</span><span class="p">);</span>
<span class="p">},</span> <span class="nx">seconds</span> <span class="o">*</span> <span class="mf">1000</span><span class="p">)</span>
|
| | | | < < < < < | | | | > | | | | < < |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 .... 1084 1085 1086 1087 1088 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 .... 1292 1293 1294 1295 1296 1297 1298 1299 1300 1301 1302 1303 1304 1305 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Code Walkthrough — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="code-walkthrough">
<h1>Code Walkthrough<a class="headerlink" href="#code-walkthrough" title="Permalink to this headline">¶</a></h1>
<div class="section" id="core-tracker-loop">
<h2>Core Tracker Loop<a class="headerlink" href="#core-tracker-loop" title="Permalink to this headline">¶</a></h2>
<p>In bitrhythm code is evaluated for every cycle.</p>
<p>1 beat = 60 / tempo
1 cycle = 1 beat / ticks</p>
<p>For every cycle visual and audio code is evaluated.</p>
<p>The edit checkbox allows you to perform long edits, where only old code is evaluated. Once you disable it, all the new edit changes are applied in the next cycle.</p>
................................................................................
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">state</span><span class="p">;</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kd">function</span> <span class="nx">romantogypsy</span><span class="p">(</span><span class="nx">hex</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">letters</span> <span class="o">=</span> <span class="nx">hex</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`0'</span><span class="p">,</span><span class="s1">'a'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`1'</span><span class="p">,</span><span class="s1">'b'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`2'</span><span class="p">,</span><span class="s1">'c'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`3'</span><span class="p">,</span><span class="s1">'d'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`4'</span><span class="p">,</span><span class="s1">'e'</span><span class="p">);</span>
<span class="nx">letters</span> <span class="o">=</span> <span class="nx">letters</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'`5'</span><span class="p">,</span><span class="s1">'f'</span><span class="p">);</span>
<span class="k">return</span> <span class="nx">letters</span><span class="p">;</span>
<span class="p">}</span>
<span class="kd">function</span> <span class="nx">lettertodec</span><span class="p">(</span><span class="nx">letter</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">bin</span> <span class="o">=</span> <span class="s2">""</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">letter</span><span class="p">.</span><span class="nx">match</span><span class="p">(</span><span class="sr">/\d/</span><span class="p">))</span> <span class="p">{</span>
<span class="nx">no</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">letter</span><span class="p">);</span>
................................................................................
<span class="p">}</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="k">return</span> <span class="nx">meta</span><span class="p">;</span>
<span class="p">}</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">pattern_meta</span> <span class="o">=</span> <span class="nx">pattern_meta</span><span class="p">;</span>
<span class="kd">function</span> <span class="nx">cue</span><span class="p">(</span><span class="nx">html</span><span class="p">,</span> <span class="nx">seconds</span> <span class="o">=</span> <span class="mf">5</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="s2">"#cued"</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">html</span><span class="p">);</span>
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="s2">"#cued"</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="s2">""</span><span class="p">);</span>
<span class="p">},</span> <span class="nx">seconds</span> <span class="o">*</span> <span class="mf">1000</span><span class="p">)</span>
|
Changes to build/html/samples.html.
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="What exactly is Tweaking ?" href="tweaking.html" />
<link rel="prev" title="Demo and Tutorial" href="demo.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="demo.html" title="previous page">Demo and Tutorial</a>
<a class='right-next' id="next-link" href="tweaking.html" title="next page">What exactly is Tweaking ?</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
| | | | | < < < < < | | | |
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Core Features" href="tweaking.html" />
<link rel="prev" title="Getting Started" href="demo.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
<div class="container-fluid" id="banner"></div>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="demo.html" title="previous page">Getting Started</a>
<a class='right-next' id="next-link" href="tweaking.html" title="next page">Core Features</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
Deleted build/html/saving.html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Saving and Sharing — Bitrhythm's literate documentation</title> <link href="_static/css/theme.css" rel="stylesheet" /> <link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" /> <link rel="stylesheet" href="_static/vendor/fontawesome/5.13.0/css/all.min.css"> <link rel="preload" as="font" type="font/woff2" crossorigin href="_static/vendor/fontawesome/5.13.0/webfonts/fa-solid-900.woff2"> <link rel="preload" as="font" type="font/woff2" crossorigin href="_static/vendor/fontawesome/5.13.0/webfonts/fa-brands-400.woff2"> <link rel="stylesheet" href="_static/pygments.css" type="text/css" /> <link rel="stylesheet" href="_static/sphinx-book-theme.e8e5499552300ddf5d7adccae7cc3b70.css" type="text/css" /> <link rel="stylesheet" type="text/css" href="_static/custom.css" /> <link rel="preload" as="script" href="_static/js/index.1c5a1a01449ed65a7b51.js"> <script id="documentation_options" data-url_root="./" src="_static/documentation_options.js"></script> <script src="_static/jquery.js"></script> <script src="_static/underscore.js"></script> <script src="_static/doctools.js"></script> <script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script> <script src="_static/analytics.js"></script> <link rel="index" title="Index" href="genindex.html" /> <link rel="search" title="Search" href="search.html" /> <link rel="next" title="Limitations and Recording" href="limitations.html" /> <link rel="prev" title="Alternate Implementations" href="alternate-implementation.html" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="docsearch:language" content="en" /> </head> <body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80"> <div class="container-fluid" id="banner"></div> <div class="container-xl"> <div class="row"> <div class="col-12 col-md-3 bd-sidebar site-navigation show" id="site-navigation"> <div class="navbar-brand-box"> <a class="navbar-brand text-wrap" href="index.html"> <h1 class="site-logo" id="site-title">Bitrhythm's literate documentation</h1> </a> </div><nav class="bd-links" id="bd-docs-nav" aria-label="Main navigation"> <div class="bd-toc-item active"> <p class="caption"> <span class="caption-text"> Table of Contents </span> </p> <ul class="current nav bd-sidenav"> <li class="toctree-l1"> <a class="reference internal" href="what.html"> What is bitrhythm about ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1 current active"> <a class="current reference internal" href="#"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> <li class="toctree-l1"> <a class="reference internal" href="bookmarks.html"> Bookmarks </a> </li> </ul> </div> </nav> <!-- To handle the deprecated key --> <div class="navbar_extra_footer"> <a target="_blank" href="/">Bitrhythm App Home</a><br> <a target="_blank" href="https://xyzzyapps.link">Xyzzy Apps Home</a><br> <p class='custom-nav-footer'>(c) Xyzzy Apps, 2021</p> </div> </div> <main class="col py-md-3 pl-md-4 bd-content overflow-auto" role="main"> <div class="topbar container-xl fixed-top"> <div class="topbar-contents row"> <div class="col-12 col-md-3 bd-topbar-whitespace site-navigation show"></div> <div class="col pl-md-4 topbar-main"> <button id="navbar-toggler" class="navbar-toggler ml-0" type="button" data-toggle="collapse" data-toggle="tooltip" data-placement="bottom" data-target=".site-navigation" aria-controls="navbar-menu" aria-expanded="true" aria-label="Toggle navigation" aria-controls="site-navigation" title="Toggle navigation" data-toggle="tooltip" data-placement="left"> <i class="fas fa-bars"></i> <i class="fas fa-arrow-left"></i> <i class="fas fa-arrow-up"></i> </button> <!-- Source interaction buttons --> <!-- Full screen (wrap in <a> to have style consistency --> <a class="full-screen-button"><button type="button" class="btn btn-secondary topbarbtn" data-toggle="tooltip" data-placement="bottom" onclick="toggleFullScreen()" aria-label="Fullscreen mode" title="Fullscreen mode"><i class="fas fa-expand"></i></button></a> <!-- Launch buttons --> </div> <!-- Table of contents --> <div class="d-none d-md-block col-md-2 bd-toc show"> </div> </div> </div> <div id="main-content" class="row"> <div class="col-12 col-md-9 pl-md-3 pr-md-0"> <div> <div class="section" id="saving-and-sharing"> <h1>Saving and Sharing<a class="headerlink" href="#saving-and-sharing" title="Permalink to this headline">¶</a></h1> <p>There is a save button that converts the state of bitrhythm into a url paramter. This means there is an upper limit on how much code you can write, making it useful for demoscene like situations. You can share the url with tinyurl.</p> <p>To make a complete song use <code class="docutils literal notranslate"><span class="pre">bars</span></code> to trigger multiple transitions.</p> </div> </div> <div class='prev-next-bottom'> <a class='left-prev' id="prev-link" href="alternate-implementation.html" title="previous page">Alternate Implementations</a> <a class='right-next' id="next-link" href="limitations.html" title="next page">Limitations and Recording</a> </div> </div> </div> <footer class="footer mt-5 mt-md-0"> <div class="container"> <p> By Xyzzy Apps<br/> © Copyright (c) Xyzzy Apps, 2021.<br/> </p> </div> </footer> </main> </div> </div> <script src="_static/js/index.1c5a1a01449ed65a7b51.js"></script> </body> </html> |
< < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < < |
Changes to build/html/search.html.
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
...
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="saving.html"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
|
|
|
<
<
<
<
<
|
|
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
...
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Getting Started </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> Core Features </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Saving and other limitations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> |
Changes to build/html/source-code.html.
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Demo and Tutorial" href="demo.html" />
<link rel="prev" title="What is bitrhythm about ?" href="what.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
................................................................................
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="what.html" title="previous page">What is bitrhythm about ?</a>
<a class='right-next' id="next-link" href="demo.html" title="next page">Demo and Tutorial</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
| | | | < < < < < | | |
32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 |
<script src="_static/jquery.js"></script>
<script src="_static/underscore.js"></script>
<script src="_static/doctools.js"></script>
<script src="_static/sphinx-book-theme.12a9622fbb08dcb3a2a40b2c02b83a57.js"></script>
<script src="_static/analytics.js"></script>
<link rel="index" title="Index" href="genindex.html" />
<link rel="search" title="Search" href="search.html" />
<link rel="next" title="Getting Started" href="demo.html" />
<link rel="prev" title="What is bitrhythm about ?" href="what.html" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="docsearch:language" content="en" />
</head>
<body data-spy="scroll" data-target="#bd-toc-nav" data-offset="80">
................................................................................
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="tweaking.html">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
</div>
<div class='prev-next-bottom'>
<a class='left-prev' id="prev-link" href="what.html" title="previous page">What is bitrhythm about ?</a>
<a class='right-next' id="next-link" href="demo.html" title="next page">Getting Started</a>
</div>
</div>
</div>
<footer class="footer mt-5 mt-md-0">
<div class="container">
|
Changes to build/html/tweaking.html.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 ... 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>What exactly is Tweaking ? — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Demo and Tutorial
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
What exactly is Tweaking ?
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Concepts and Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="saving.html">
Saving and Sharing
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Limitations and Recording
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="tocsection onthispage pt-5 pb-3">
<i class="fas fa-list"></i> Contents
</div>
<nav id="bd-toc-nav">
<ul class="visible nav section-nav flex-column">
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#is-bitrhythm-maths-heavy">
Is Bitrhythm Maths heavy ?
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#dj-controls">
DJ Controls
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#music-is-arrangement">
Music is arrangement
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#see-also">
See Also
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="what-exactly-is-tweaking">
<h1>What exactly is Tweaking ?<a class="headerlink" href="#what-exactly-is-tweaking" title="Permalink to this headline">¶</a></h1>
<p>For that you need some context.</p>
<p>Historically speaking, music was an accompaniment for theatrical plays. A typical song has a Theme and develops Exposition / Conflict / Resolution through time. Its not a coincidence that the sonata and the dramatic structure share the same form. In a typical play you have scenes, transitions, sets in the background and characters in the foreground. While the play progresses and characters clash you get music alongside each of these elements. Every song has a title that guides the listener to what the song is about. Typical Scenes include intro, bridge, buildup, section, breakdown and climax. What is the intro about ? What is the bridge about ? What is the verse about ? What is the chorus about ? What are the sections about ? The essential question driving any story is how to be ? In a drama this question is answered with doubts, emotion, circularity, warnings from the chorus, exposition, rises, falls, reprisals, conclusions, contradictions, denouncements, confrontations, mistakes, reversals, recognition, revelation resolution, statements and breakdowns.</p>
<p>Here another way of thinking about it. A song is about answering a question posed the title / intro perhaps. The question which the artist poses to the audience. Verses are the answers. Rhythm dictates the demarcates the flow of time and seasons.</p>
<p>Modern music has evolved to be standalone but it retains elements of theatrical story telling. You can divide a song into verses and sections. In the documentation, we will use the terms from plays. Within each musical scene you typically have,</p>
<ul class="simple">
<li><p>Background: You use layers of rhythm and groove to set the mood.</p></li>
<li><p>Foreground: Lead (Soliloquy), Counterpoint (Character Conflict), Call Response(Dialogues), Motif, Ornaments (Exposition)</p></li>
</ul>
<p>In Electronic Music, the foreground is mainly developed using Layers(polyrhythms) and Tweaking. Tweaking and Layers effectively function for the purposes of Exposition and Conflict. Chorus, Fade, Drop are used for transitions typically in electronic music. Tweaking is also called knob-twisting by hardware users. To compare the foreground in others,</p>
<p>Classical Music: Counterpoint and Harmony<br />
Rock: Call Response</p>
<p>Now EDM - Dub, Techno and Jungle - are distinct musical genres. What could they possibly share ?</p>
<ol class="simple">
<li><p>All three uphold the primacy of Rhythm for start.</p></li>
<li><p>All three are instrumental.</p></li>
<li><p>Voices are used sparingly as samples.</p></li>
<li><p>All three have a tradition of live acts.</p></li>
<li><p>Dub Plates are common for these genres.</p></li>
<li><p>Melody is nothing but a repeating stab (motif)</p></li>
</ol>
<p>If you want to add a solo to EDM, you typically add a live instrument.</p>
<p>Dub Music is made by messing with the Recording Engineer’s Mixing desk. A prime example of tweaking.</p>
<iframe width="420" height="315" src="https://www.youtube.com/embed/oJs1wR8tLr4" frameborder="0" allowfullscreen></iframe>
<p>Techno is made by messing with Hardware or Hardware + Software. Tweaking + Layering.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/ppEhaH3jSzo" frameborder="0" allowfullscreen></iframe>
<p>Jungle is used as a catch all for Breakbeat, Hardcore as well. Jungle Music is made by messing with Hardware + Software combo. Complex Layering is used here.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/q72qoGYirwU" frameborder="0" allowfullscreen></iframe>
<p>Bitrhythm only supports rhythmic notations and is geared towards electronic music. My current goal is to produce an IDM track and Chiptune with it with complex rhythmic patterns. As for techno the current setup seems alright. Support will be added in the future for pitch manipulation in a different module or a different project. There is a piano module in the code with midi support but its currently deactivated.</p>
<p>You can treat a musical scale as no different than a drumset. The pentatanic scale approximately maps to a drumset and you can use techniques from <a class="reference external" href="https://www.youtube.com/watch?v=1qdyxML4tF0">melodic drumming</a> with multiple samples. This is typically how drummers approach guitars.</p>
<div class="section" id="is-bitrhythm-maths-heavy">
<h2>Is Bitrhythm Maths heavy ?<a class="headerlink" href="#is-bitrhythm-maths-heavy" title="Permalink to this headline">¶</a></h2>
<p>You will need some basic maths operations to understand and use bitrhythm effectively. These operations are about working with lists of numbers and lists of strings.</p>
<p>Some common operations on lists include</p>
<ul class="simple">
<li><p>Rotate</p></li>
<li><p>Invert</p></li>
................................................................................
<li><p>Neo-Riemannian_theory, Combinatory theory</p></li>
<li><p>Sacred Geometry</p></li>
<li><p>Circle of fifths, chord progressions</p></li>
<li><p>Set transformations like inversion on Scales</p></li>
<li><p>Licks from books</p></li>
<li><p>Randomness, I Ching, Playing Cards</p></li>
</ol>
</div>
<div class="section" id="dj-controls">
<h2>DJ Controls<a class="headerlink" href="#dj-controls" title="Permalink to this headline">¶</a></h2>
<div class="admonition-todo admonition" id="id1">
<p class="admonition-title">Todo</p>
<p>Expand</p>
</div>
<p>Essentially a DJ is like a conductor. Loops are like individual instrumentalists.</p>
<ol class="simple">
<li><p>Cueing -> Mute / Solo</p></li>
<li><p>Dynamics -> Volume</p></li>
<li><p>Ornamentation -> Cutoff</p></li>
<li><p>Tempo, Beat Counting -> Beat Matching</p></li>
</ol>
</div>
<div class="section" id="music-is-arrangement">
<h2>Music is arrangement<a class="headerlink" href="#music-is-arrangement" title="Permalink to this headline">¶</a></h2>
<iframe width="420" height="315" src="https://www.youtube.com/embed/tprMEs-zfQA" frameborder="0" allowfullscreen></iframe>
</div>
<div class="section" id="see-also">
<h2>See Also<a class="headerlink" href="#see-also" title="Permalink to this headline">¶</a></h2>
<p>In screenplays you also have a <a class="reference external" href="https://www.youtube.com/watch?v=cG5zKwmXLgo">setup / payoff</a> dynamic.</p>
<p>Setup</p>
<ul class="simple">
<li><p>Obstacles</p></li>
<li><p>Challenges</p></li>
<li><p>Forces</p></li>
<li><p>Context</p></li>
</ul>
</div>
</div>
</div>
|
| | | | < < < < < | | | | | | | < < < < < | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | > > > > > < < < < < < < < < < < < < < < < < < < < < < < < < < < < < |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .. 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 ... 292 293 294 295 296 297 298 299 300 301 302 303 304 305 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Core Features — Bitrhythm's literate documentation</title>
<link href="_static/css/theme.css" rel="stylesheet" />
<link href="_static/css/index.c5995385ac14fb8791e8eb36b4908be2.css" rel="stylesheet" />
<link rel="stylesheet"
href="_static/vendor/fontawesome/5.13.0/css/all.min.css">
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="source-code.html">
Source Code and License
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="demo.html">
Getting Started
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="samples.html">
Samples
</a>
</li>
<li class="toctree-l1 current active">
<a class="current reference internal" href="#">
Core Features
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="early-attempts.html">
Early Attempts
</a>
</li>
................................................................................
<li class="toctree-l1">
<a class="reference internal" href="changelog.html">
Changelog
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="main.html">
Code Walkthrough
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="alternate-implementation.html">
Alternate Implementations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="limitations.html">
Saving and other limitations
</a>
</li>
<li class="toctree-l1">
<a class="reference internal" href="credits.html">
Credits
</a>
</li>
................................................................................
<div class="tocsection onthispage pt-5 pb-3">
<i class="fas fa-list"></i> Contents
</div>
<nav id="bd-toc-nav">
<ul class="visible nav section-nav flex-column">
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#sequencer-notation">
Sequencer Notation
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#tweaking-and-transitions">
Tweaking and Transitions
</a>
</li>
<li class="toc-h2 nav-item toc-entry">
<a class="reference internal nav-link" href="#is-bitrhythm-maths-heavy">
Is Bitrhythm Maths heavy ?
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div id="main-content" class="row">
<div class="col-12 col-md-9 pl-md-3 pr-md-0">
<div>
<div class="section" id="core-features">
<h1>Core Features<a class="headerlink" href="#core-features" title="Permalink to this headline">¶</a></h1>
<div class="section" id="sequencer-notation">
<h2>Sequencer Notation<a class="headerlink" href="#sequencer-notation" title="Permalink to this headline">¶</a></h2>
<p>Bitrhythm only supports rhythmic notations and is geared towards electronic music. My current goal is to produce an IDM track, a DNB track and a Chiptune with complex rhythmic patterns. As for Techno the current setup seems alright but more support for DJ style transitions are needed.</p>
<p>You can treat a musical scale as no different than a drumset. The pentatanic scale approximately maps to a drumset and you can use techniques from <a class="reference external" href="https://www.youtube.com/watch?v=1qdyxML4tF0">melodic drumming</a> with multiple samples. This is typically how drummers approach guitars.</p>
</div>
<div class="section" id="tweaking-and-transitions">
<h2>Tweaking and Transitions<a class="headerlink" href="#tweaking-and-transitions" title="Permalink to this headline">¶</a></h2>
<p>These are key to making electronic music. Tweaking is also called Automation and knob-twisting by hardware users.</p>
<p>Modern music has evolved to be standalone but it retains elements of theatrical story telling. You can divide a song into verses and sections. In the documentation, we will use the terms from plays - scenes. Within each musical scene you typically have,</p>
<ul class="simple">
<li><p>Background: You use layers of rhythm and groove to set the mood.</p></li>
<li><p>Foreground: Lead (Soliloquy), Counterpoint(Character Conflict), Call Response(Dialogues), Motif, Ornaments (Exposition)</p></li>
</ul>
<p>In screenplays you also have a <a class="reference external" href="https://www.youtube.com/watch?v=cG5zKwmXLgo">setup / payoff</a> dynamic.</p>
<p>Setup</p>
<ul class="simple">
<li><p>Obstacles</p></li>
<li><p>Challenges</p></li>
<li><p>Forces</p></li>
<li><p>Context</p></li>
</ul>
<p>In Electronic Music the foreground is mainly developed via Tweaking. Tweaking effectively functions for the purposes of Exposition and Conflict. Chorus, Fade, Drop are used for transitions typically in electronic music. To compare the foreground in others,</p>
<p>Classical Music: Counterpoint and Harmony<br>
Rock: Call Response<br></p>
<p>To make a complete song in bitrhythm use <code class="docutils literal notranslate"><span class="pre">bars</span></code> to trigger multiple transitions.</p>
<p>Essentially a DJ is like a conductor. Loops are like individual instrumentalists.</p>
<ol class="simple">
<li><p>Cueing -> Mute / Solo</p></li>
<li><p>Dynamics -> Volume</p></li>
<li><p>Ornamentation -> Cutoff</p></li>
<li><p>Tempo, Beat Counting -> Beat Matching</p></li>
</ol>
<iframe width="420" height="315" src="https://www.youtube.com/embed/tprMEs-zfQA" frameborder="0" allowfullscreen></iframe>
</div>
<div class="section" id="is-bitrhythm-maths-heavy">
<h2>Is Bitrhythm Maths heavy ?<a class="headerlink" href="#is-bitrhythm-maths-heavy" title="Permalink to this headline">¶</a></h2>
<p>You will need some basic maths operations to understand and use bitrhythm effectively. These operations are about working with lists of numbers and lists of strings.</p>
<p>Some common operations on lists include</p>
<ul class="simple">
<li><p>Rotate</p></li>
<li><p>Invert</p></li>
................................................................................
<li><p>Neo-Riemannian_theory, Combinatory theory</p></li>
<li><p>Sacred Geometry</p></li>
<li><p>Circle of fifths, chord progressions</p></li>
<li><p>Set transformations like inversion on Scales</p></li>
<li><p>Licks from books</p></li>
<li><p>Randomness, I Ching, Playing Cards</p></li>
</ol>
</div>
</div>
</div>
|
Changes to build/html/what.html.
76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 ... 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 ... 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 ... 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 |
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Demo and Tutorial </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> What exactly is Tweaking ? </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Concepts and Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="saving.html"> Saving and Sharing </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Limitations and Recording </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> ................................................................................ <div class="tocsection onthispage pt-5 pb-3"> <i class="fas fa-list"></i> Contents </div> <nav id="bd-toc-nav"> <ul class="visible nav section-nav flex-column"> <li class="toc-h2 nav-item toc-entry"> <a class="reference internal nav-link" href="#about-author"> About Author </a> </li> <li class="toc-h2 nav-item toc-entry"> <a class="reference internal nav-link" href="#support-this-project"> Support this project </a> </li> ................................................................................ <div id="main-content" class="row"> <div class="col-12 col-md-9 pl-md-3 pr-md-0"> <div> <div class="section" id="what-is-bitrhythm-about"> <h1>What is bitrhythm about ?<a class="headerlink" href="#what-is-bitrhythm-about" title="Permalink to this headline">¶</a></h1> <p>Currently this is how you can use code with music,</p> <ol class="simple"> <li><p>VST plugins</p></li> <li><p>DAW scripting</p></li> <li><p>Embedded code to interact with electronics</p></li> <li><p>ML approaches</p></li> <li><p>Live coding</p></li> <li><p>Use some weird algorithms / number sequences / hardcoded chords / random numbers</p></li> <li><p>Web Audio / Audio Programming languages</p></li> </ol> <p>Bitrhythm offers 4-7. In Bitrhythm you get a coding playground to explore and learn webaudio and webgl apis for the purposes of</p> <ol class="simple"> <li><p>live visual programming</p></li> <li><p>live audio programming</p></li> <li><p>music sequencing</p></li> <li><p>interactive music</p></li> <li><p>audio visualisation</p></li> <li><p>music learning</p></li> </ol> <p>Apart from the core html apis, you can also use the following libraries</p> <ol class="simple"> <li><p>Tuna</p></li> <li><p>Timbral</p></li> <li><p>Tone.js</p></li> <li><p>Underscore / Rambda</p></li> <li><p>cellx</p></li> <li><p>Magenta.js (Machine Learning)</p></li> <li><p>P5.js / D3</p></li> <li><p>Winamp Visualisations (butterchurn)</p></li> </ol> <div class="highlight-html notranslate"><div class="highlight"><pre><span></span><span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> ................................................................................ <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/webmidi@2.0.0"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://code.jquery.com/jquery-3.4.1.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"/nexus-js/dist/NexusUI.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/cellx/1.10.19/cellx.umd.min.js"</span> <span class="na">integrity</span><span class="o">=</span><span class="s">"sha512-ojEcAP3e6N+n5MDKPW6CexXzuLDahDPkNZmzyRV4t2zqh9nwljJNuV8JGa+xjpnAaGB/FhsAU7P6IHEP0dtJQA=="</span> <span class="na">crossorigin</span><span class="o">=</span><span class="s">"anonymous"</span> <span class="na">referrerpolicy</span><span class="o">=</span><span class="s">"no-referrer"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> </pre></div> </div> <div class="section" id="about-author"> <h2>About Author<a class="headerlink" href="#about-author" title="Permalink to this headline">¶</a></h2> <p>I make <a class="reference external" href="https://xyzzyapps.link">web apps</a> apps for a living. I started messing with algorithmic composition using pure data around 2011. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections.</p> <p>For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. <a class="reference external" href="https://www.youtube.com/watch?v=adz1Gv5Lm34">This library</a> in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker.</p> <p>After my initial work on the project in 2019, the project got sidetracked. After seeing <a class="reference external" href="https://www.vitling.xyz/toys/acid-banger/">endless acid banger</a> I had an epiphany to work on this project again. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined.</p> <p>The documentation for the literate programming project - wheel is <a class="reference external" href="https://xyzzyapps.link/wheel/">available here</a>.</p> </div> <div class="section" id="support-this-project"> <h2>Support this project<a class="headerlink" href="#support-this-project" title="Permalink to this headline">¶</a></h2> <p>My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world.</p> <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> <p>You can find me on <a class="reference external" href="https://theaudioprogrammer.com/">theaudioprogrammer</a> and algorave discord as @xyzzy.</p> </div> </div> </div> |
| | | < < < < < | | | > > > > > | < < < < < < < < < < < < < < < < < < | > > > > > > > > | | < > > > > > > > | | |
76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 ... 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 ... 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 ... 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 ... 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 |
<li class="toctree-l1"> <a class="reference internal" href="source-code.html"> Source Code and License </a> </li> <li class="toctree-l1"> <a class="reference internal" href="demo.html"> Getting Started </a> </li> <li class="toctree-l1"> <a class="reference internal" href="samples.html"> Samples </a> </li> <li class="toctree-l1"> <a class="reference internal" href="tweaking.html"> Core Features </a> </li> <li class="toctree-l1"> <a class="reference internal" href="early-attempts.html"> Early Attempts </a> </li> ................................................................................ <li class="toctree-l1"> <a class="reference internal" href="changelog.html"> Changelog </a> </li> <li class="toctree-l1"> <a class="reference internal" href="main.html"> Code Walkthrough </a> </li> <li class="toctree-l1"> <a class="reference internal" href="alternate-implementation.html"> Alternate Implementations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="limitations.html"> Saving and other limitations </a> </li> <li class="toctree-l1"> <a class="reference internal" href="credits.html"> Credits </a> </li> ................................................................................ <div class="tocsection onthispage pt-5 pb-3"> <i class="fas fa-list"></i> Contents </div> <nav id="bd-toc-nav"> <ul class="visible nav section-nav flex-column"> <li class="toc-h2 nav-item toc-entry"> <a class="reference internal nav-link" href="#adc-2021"> ADC 2021 </a> </li> <li class="toc-h2 nav-item toc-entry"> <a class="reference internal nav-link" href="#inspiration-for-the-project"> Inspiration for the project </a> </li> <li class="toc-h2 nav-item toc-entry"> <a class="reference internal nav-link" href="#support-this-project"> Support this project </a> </li> ................................................................................ <div id="main-content" class="row"> <div class="col-12 col-md-9 pl-md-3 pr-md-0"> <div> <div class="section" id="what-is-bitrhythm-about"> <h1>What is bitrhythm about ?<a class="headerlink" href="#what-is-bitrhythm-about" title="Permalink to this headline">¶</a></h1> <p>In Bitrhythm you get a coding playground to make music with webaudio, canvas and webgl apis. You can share the final track as a URL which enables interactive music with your listener. The url size limit acts as a contraint on creativity.</p> <p>Apart from the core html apis, you can also use the following libraries</p> <ol class="simple"> <li><p>Tuna</p></li> <li><p>Timbral</p></li> <li><p>Tone.js</p></li> <li><p>Underscore / Rambda</p></li> <li><p>cellx (observers)</p></li> <li><p>Magenta.js (Machine Learning)</p></li> <li><p>P5.js / D3</p></li> <li><p>Winamp Visualisations (butterchurn)</p></li> </ol> <div class="highlight-html notranslate"><div class="highlight"><pre><span></span><span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> ................................................................................ <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdn.jsdelivr.net/npm/webmidi@2.0.0"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://code.jquery.com/jquery-3.4.1.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"/nexus-js/dist/NexusUI.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/cellx/1.10.19/cellx.umd.min.js"</span> <span class="na">integrity</span><span class="o">=</span><span class="s">"sha512-ojEcAP3e6N+n5MDKPW6CexXzuLDahDPkNZmzyRV4t2zqh9nwljJNuV8JGa+xjpnAaGB/FhsAU7P6IHEP0dtJQA=="</span> <span class="na">crossorigin</span><span class="o">=</span><span class="s">"anonymous"</span> <span class="na">referrerpolicy</span><span class="o">=</span><span class="s">"no-referrer"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> <span class="p"><</span><span class="nt">script</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"</span><span class="p">></</span><span class="nt">script</span><span class="p">></span> </pre></div> </div> <p>A few things implemented from scratch in Bitrhythm are,</p> <ol class="simple"> <li><p>DSL for describing music sequences - similar to the tracker notation</p></li> <li><p>A core Music Loop that runs your javascript code, with an edit mode</p></li> <li><p>A knob and guard abstraction for programming automation</p></li> </ol> <p>You can use Bitrhythm for making music similar to the music possible with trackers like Buzz / Renoise / OpenMPT. I call this approach Hard Coding music. This is also known as executable music in the Demoscene.</p> <p>You can also use Bitrhythm for Live Coding and Algorithmic composition.</p> <div class="section" id="adc-2021"> <h2>ADC 2021<a class="headerlink" href="#adc-2021" title="Permalink to this headline">¶</a></h2> <p>I presented Bitrhythm in ADC ‘21.</p> <p><a class="reference external" href="https://xyzzyapps.link/adc21">Slides</a></p> <p>Video: TBD</p> </div> <div class="section" id="inspiration-for-the-project"> <h2>Inspiration for the project<a class="headerlink" href="#inspiration-for-the-project" title="Permalink to this headline">¶</a></h2> <p>I make <a class="reference external" href="https://xyzzyapps.link">web apps</a> for a living. I started messing with algorithmic composition using pure data around 2011. In many ways Pure Data was my first DAW. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections.</p> <p>For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. <a class="reference external" href="https://www.youtube.com/watch?v=adz1Gv5Lm34">This library</a> in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker.</p> <p>After my initial work on the project in 2019, the project got sidetracked. After seeing <a class="reference external" href="https://www.vitling.xyz/toys/acid-banger/">endless acid banger</a> I had an epiphany to work on this project again with programmatic knobs. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined.</p> <p>The documentation for the literate programming project - wheel is <a class="reference external" href="https://xyzzyapps.link/wheel/">available here</a>.</p> </div> <div class="section" id="support-this-project"> <h2>Support this project<a class="headerlink" href="#support-this-project" title="Permalink to this headline">¶</a></h2> <p>My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world.</p> <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> <p>You can find me on <a class="reference external" href="https://theaudioprogrammer.com/">theaudioprogrammer</a>, demoscene and algorave discord as @xyzzy.</p> </div> </div> </div> |
Changes to public/misc.js.
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
...
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
|
} else {
return state;
}
}
}
function romantogypsy(hex) {
var letters = hex.replace('`1','a');
letters = letters.replace('`2','b');
letters = letters.replace('`3','c');
letters = letters.replace('`4','d');
letters = letters.replace('`5','e');
letters = letters.replace('`6','f');
return letters;
}
function lettertodec(letter) {
var bin = "";
if (letter.match(/\d/)) {
no = parseInt(letter);
................................................................................
}
}
}
return meta;
}
window.pattern_meta = pattern_meta;
function cue(html, seconds = 5) {
$("#cued").html(html);
setTimeout(function () {
$("#cued").html("");
}, seconds * 1000)
|
|
|
|
|
|
|
<
|
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
...
239
240
241
242
243
244
245
246
247
248
249
250
251
252
|
} else {
return state;
}
}
}
function romantogypsy(hex) {
var letters = hex.replace('`0','a');
letters = letters.replace('`1','b');
letters = letters.replace('`2','c');
letters = letters.replace('`3','d');
letters = letters.replace('`4','e');
letters = letters.replace('`5','f');
return letters;
}
function lettertodec(letter) {
var bin = "";
if (letter.match(/\d/)) {
no = parseInt(letter);
................................................................................
}
}
}
return meta;
}
window.pattern_meta = pattern_meta;
function cue(html, seconds = 5) {
$("#cued").html(html);
setTimeout(function () {
$("#cued").html("");
}, seconds * 1000)
|
Deleted public/samples/bd01.wav.
cannot compute difference between binary files
Deleted public/samples/bd02.wav.
cannot compute difference between binary files
Deleted public/samples/bd03.wav.
cannot compute difference between binary files
Deleted public/samples/bd04.wav.
cannot compute difference between binary files
Deleted public/samples/bd05.wav.
cannot compute difference between binary files
Deleted public/samples/bd06.wav.
cannot compute difference between binary files
Deleted public/samples/bd07.wav.
cannot compute difference between binary files
Deleted public/samples/bd08.wav.
cannot compute difference between binary files
Deleted public/samples/bd09.wav.
cannot compute difference between binary files
Deleted public/samples/bd10.wav.
cannot compute difference between binary files
Deleted public/samples/cp01.wav.
cannot compute difference between binary files
Deleted public/samples/cp02.wav.
cannot compute difference between binary files
Deleted public/samples/cp03.wav.
cannot compute difference between binary files
Deleted public/samples/cp04.wav.
cannot compute difference between binary files
Deleted public/samples/cr01.wav.
cannot compute difference between binary files
Deleted public/samples/cr02.wav.
cannot compute difference between binary files
Deleted public/samples/cr03.wav.
cannot compute difference between binary files
Deleted public/samples/cr04.wav.
cannot compute difference between binary files
Deleted public/samples/hh01.wav.
cannot compute difference between binary files
Deleted public/samples/hh02.wav.
cannot compute difference between binary files
Deleted public/samples/hh03.wav.
cannot compute difference between binary files
Deleted public/samples/hh04.wav.
cannot compute difference between binary files
Deleted public/samples/ht01.wav.
cannot compute difference between binary files
Deleted public/samples/ht02.wav.
cannot compute difference between binary files
Deleted public/samples/ht03.wav.
cannot compute difference between binary files
Deleted public/samples/ht04.wav.
cannot compute difference between binary files
Deleted public/samples/ht05.wav.
cannot compute difference between binary files
Deleted public/samples/ht06.wav.
cannot compute difference between binary files
Deleted public/samples/ht07.wav.
cannot compute difference between binary files
Deleted public/samples/ht08.wav.
cannot compute difference between binary files
Deleted public/samples/lt01.wav.
cannot compute difference between binary files
Deleted public/samples/lt02.wav.
cannot compute difference between binary files
Deleted public/samples/lt03.wav.
cannot compute difference between binary files
Deleted public/samples/lt04.wav.
cannot compute difference between binary files
Deleted public/samples/lt05.wav.
cannot compute difference between binary files
Deleted public/samples/lt06.wav.
cannot compute difference between binary files
Deleted public/samples/lt07.wav.
cannot compute difference between binary files
Deleted public/samples/lt08.wav.
cannot compute difference between binary files
Deleted public/samples/mt01.wav.
cannot compute difference between binary files
Deleted public/samples/mt02.wav.
cannot compute difference between binary files
Deleted public/samples/mt03.wav.
cannot compute difference between binary files
Deleted public/samples/mt04.wav.
cannot compute difference between binary files
Deleted public/samples/mt05.wav.
cannot compute difference between binary files
Deleted public/samples/mt06.wav.
cannot compute difference between binary files
Deleted public/samples/mt07.wav.
cannot compute difference between binary files
Deleted public/samples/mt08.wav.
cannot compute difference between binary files
Deleted public/samples/oh01.wav.
cannot compute difference between binary files
Deleted public/samples/oh02.wav.
cannot compute difference between binary files
Deleted public/samples/oh03.wav.
cannot compute difference between binary files
Deleted public/samples/oh04.wav.
cannot compute difference between binary files
Deleted public/samples/rd01.wav.
cannot compute difference between binary files
Deleted public/samples/rd02.wav.
cannot compute difference between binary files
Deleted public/samples/rd03.wav.
cannot compute difference between binary files
Deleted public/samples/rd04.wav.
cannot compute difference between binary files
Deleted public/samples/rs01.wav.
cannot compute difference between binary files
Deleted public/samples/rs02.wav.
cannot compute difference between binary files
Deleted public/samples/sd01.wav.
cannot compute difference between binary files
Deleted public/samples/sd02.wav.
cannot compute difference between binary files
Deleted public/samples/sd03.wav.
cannot compute difference between binary files
Deleted public/samples/sd04.wav.
cannot compute difference between binary files
Deleted public/samples/sd05.wav.
cannot compute difference between binary files
Deleted public/samples/sd06.wav.
cannot compute difference between binary files
Deleted public/samples/sd07.wav.
cannot compute difference between binary files
Deleted public/samples/sd08.wav.
cannot compute difference between binary files
Deleted public/samples/sd09.wav.
cannot compute difference between binary files
Deleted public/samples/sd10.wav.
cannot compute difference between binary files
Deleted public/samples/sd11.wav.
cannot compute difference between binary files
Deleted public/samples/sd12.wav.
cannot compute difference between binary files
Deleted public/samples/sd13.wav.
cannot compute difference between binary files
Deleted public/samples/sd14.wav.
cannot compute difference between binary files
Deleted public/samples/sd15.wav.
cannot compute difference between binary files
Changes to source/changelog.md.
28 29 30 31 32 33 34 35 36 37 |
```
Theme changes
Lots of Docs
Tutorials
Working visuals
Code Mirror Issue
```
|
> > > > > > > > > > > > > |
28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
```
Theme changes
Lots of Docs
Tutorials
Working visuals
Code Mirror Issue
```
Oct - Nov 2021 - ADC21
```
Updated the sequencer notation
Second Demo Song
Autocommit
Keyboard Bindings
Reverting to setInterval
Added code for p5
Update the docs
```
|
Changes to source/demo.md.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
...
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
|
# Demo and Tutorial ## Video <iframe width="560" height="315" src="https://www.youtube.com/embed/GTfmTMrSpag" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> Postprocessed using Reaper with EQ and Surround effects to add some sparkle. Video is recorded with the help of Blackhole and Kap and rendered by Reaper. Samples taken from Deep Techno and Dub Techno collections from splice. Sadly I can't distribute the song itself as I would also have to distribute the samples with it. ## Demo Song 1 // Techno Code for the Demo Song. The visualisation was disabled in the Demo as it was causing a huge lag while recording on both windows and mac. Note: Could could be outdated due to latest changes to the API. ``` volume_guard1 = guard([-20,15]) volume_guard2 = guard([-20,15]) ................................................................................ p(6, "C3", "48n") } } } ``` ## Getting Started This illustrates the core concepts of bitrhythm. 1. Samples (Tone.Sampler) 2. Dials (use cellx internally) 3. Observers (cellx) See <https://tonejs.github.io/> for more notes. For an understanding of the global variables see the concepts and code walkthrough section. - patterns and track_no - isHit, current_bit - samples - Tone - cellx - window and any thing included with the script tag is available here `mem` is short for memory. All instruments and effects are saved here so that they can be accessed everywhere. Step to create the basic song. 1. Click on `Add Sample URL` to add the following URLs - /Kick01.wav - /Snare19.wav - /Closedhat01.wav - /MiscSynthStab04.wav 2. Click on `Add Dial` 3. Enter the following into the window ``` scene1 = [ cellx("p 1000 1000 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0000 x000 0000 x000"), ] scene2 = [ cellx("p 1011 1001 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0000 x000 0000 x000"), ] patterns = scene1 var once = function () { Tone.Master.volume.value = -30 mem.master = new Tone.Channel({channelCount: 2, volume: -10}).chain( Tone.Destination); mem.volume_guard = guard([-20,-10]); Sample("k", 0); Sample("h", 1); Sample("sn", 2); handlers["ex"] = function (val) { if (val > 0.5) { mem["start_snare"] = true; } } dials[0]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); handlers["ex"](val); }) } if (bars <= 3 ) { transition = once; } else { transition = tweak; } if (isHit) { if (track_no == 1) { p(0); } if (track_no == 2) { p(1); } if (track_no == 3) { if (mem["start_snare"]) { p(2); }; } } ``` Now try changing the code. ``` patterns = scene2 ``` Increase the dial to see the addition of the snare. This is how you can use observers to trigger unrelated changes. I call them sideevents, as the logic is similar to sidechain, which typically observers the volume. Comment and Uncomment lines in the `if (isHit)` block. To mute and unmute sections. *Note:* `mem["k0_channel"].solo = true;` is not working. **Visuals** Change the once function to this and click `+ Execute Once` Code is taken from butterchurn. Try changing [presets](https://butterchurnviz.com/) to get different visuals. ``` var tweak = function() { initWinamp("_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"); render_loop = function () { window.visualizer.render(); } } ``` **Tweaking** First click `+ Number`. This is useful to check if the knob function is actually working. And click `+ Execute Once` ``` var tweak = function () { mem.k1 = knob({ramp : [0.09,1.8, 0.4, 2, 1.5, 1, 0.5, 3, 5, 8, 2], "number": numbers[0]["v"] }); always = function () { mem["k0_filter"].frequency.value = mem.k1.move() * 1000; } } ``` As you can sere numbers and dials will be available as a global array. There is no way to remove them so be careful about the order in which you add them. The following code will always be executed as its at the top level. As you can see this code implies that the first dial is connected to the master volume. Use guards to avoid going deaf as someundefineds editing can created bad frequency numbers. ``` Tone.Master.volume.value = volume_guard((1 - dials[0]["cell"]()) * -30); ``` ## Tutorial - Kick + Filter - Snare + Filter - Snare + Filter + Delay - High Hat - Lead + Filter - Dub Stab + Filter + Reverb Tip: In Tone.js you can't call connect one after another, you need to use chain. TODO: Add glide to Lead to make it more 303 sounding Master is connected with Surround and Volume Limiter. Use Gates and Limiters to avoid going deaf. Tone.MultiInstrument gave lots of glitches, so custom voices are written in the voice function Channels provide - Mute - Solo More improvements for the Stab - Chorus or Phaser - Compressor - Decay in envelope - Separate filters - EQ - Sends for more delay - LFO for filters Freeverb does not work and also needs Mono to function properly ``` var reverb = new Tone.Freeverb().toDestination(); var reverb_mono = new Tone.Mono().connect(reverb); reverb.dampening = 100; reverb.roomSize = 0.9; ``` ## Full Code ``` volume_guard1 = guard([-20,15]) Tone.Master.volume.value = volume_guard1(Math.round(dials[0]["cell"]() * 30) -20); // mem["stab_channel"].volume.value = volume_guard2(-2); // mem["stab_filter"].frequency.value = Math.round(dials[1]["cell"]() * 10000); scene1 = [ cellx("p 1000 1000 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0x00 0000 0000 x000"), cellx("p 0000 x000 0000 x000"), cellx("p xx0x c0x0 x0x0 x0xx"), cellx("p x000 x0x0 0000 x0x0"), ] patterns = scene1 function NoiseSynth (name) { name = name || "wf"; mem[name + "_stereo"] = new Tone.StereoWidener({width: 1}); mem[name] = new Tone.Noise("pink").start(); mem[name + "_filter"] = new Tone.Filter(400, 'lowpass', -96); mem[name + "_channel"] = new Tone.Channel({channelCount: 2, volume: -10, pan: -0.8}).chain(mem[name + "_filter"], mem[name + "_stereo"], mem.master); mem[name].connect(mem[name + "_channel"]) } function Stab(name) { name = name || "stab"; mem[name + "_filter"] = new Tone.Filter(5250, 'lowpass', -96); mem[name + "_hfilter"] = new Tone.Filter(80, 'highpass', -96); mem[name + "_reverb"] = new Tone.Reverb(0.1); mem[name + "_delay"] = new Tone.FeedbackDelay("4n", 0.4); // mem[name + "_pdelay"] = new Tone.PingPongDelay("2n", 0.1); mem[name + "_stereo"] = new Tone.StereoWidener({width: 0.25}); mem[name + "_channel"] = new Tone.Channel({channelCount: 2, volume: -2}).chain(mem[name + "_filter"] , mem[name + "_delay"], mem[name + "_reverb"], mem[name + "_hfilter"] ,mem[name + "_stereo"], mem.master) function voice(no, type) { mem[name + "_synth" + no] = new Tone.MonoSynth({ oscillator: { type: type } }) mem[name + "_synth" + no].connect(mem[name + "_channel"]); } voice(1, "sawtooth") voice(2, "sawtooth") voice(3, "sawtooth") voice(4, "pwm") voice(5, "pwm") voice(6, "pwm") } function s(vel, notes, duration) { vel = vel || 1.0; duration = duration || "2n"; notes = notes || ["E2", "B2", "G2"]; mem["stab_synth1"].triggerAttackRelease(notes[0], duration, undefined, vel); mem["stab_synth2"].triggerAttackRelease(notes[1], duration, undefined, vel); mem["stab_synth3"].triggerAttackRelease(notes[2], duration, undefined, vel); mem["stab_synth4"].triggerAttackRelease(notes[0], duration, undefined, vel); mem["stab_synth5"].triggerAttackRelease(notes[1], duration, undefined, vel); mem["stab_synth6"].triggerAttackRelease(notes[2], duration, undefined, vel); } function once() { var pr; const s = ( p ) => { pr = p; var img; let x = 100; let y = 100; p.setup = function() { var x = p.createCanvas(700, 410); x.canvas.style.position = "absolute"; p.frameRate(30); img = p.loadImage('/test.png'); }; p.draw = function() { var e = getRandomInt(2); p.clear(); if (e == 0) { // p.fill(123); // p.rect(x,y,50,50); } else { // p.image(img, 0, 0); } }; }; let myp5 = new p5(s, document.getElementById('canvas-container')); var visualizer = initWinamp("_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"); render_loop = function () { visualizer.render(); } Tone.Master.volume.value = -30; mem.master = new Tone.Channel({channelCount: 2, volume: -10}).chain(Tone.Destination); // NoiseSynth(); Stab(); Sample("k", 0, 3000, 3); Sample("h", 1, 7000, -15); Sample("sn",2, 6000, -15); Sample("c", 3, 620, 2); Sample("l", 4, 420, -15); handlers["1"] = function (val) { if (val > 0.5) { mem["start_snare"] = true; } else { mem["start_snare"] = false; } mem["stab_filter"].Q.value = Math.round(val * 5); } dials[1]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); handlers["1"](val); }) } function tweak () { mem.k1 = knob({ramp : [0.525, 0.8, 0.4, 1, 0.25, 0.75, 1, 0.25, 0.1], "number": dials[2]["cell"] }); always = function () { mem["stab_filter"].frequency.value = mem.k1.move() * 10000; } } if (bars <= 3 ) { transition = once; } else { transition = tweak; } if (isHit) { if (track_no == 1) { if (bars > 0 ) { p(0); } } if (track_no == 2) { if (bars > 8 ) { p(1); } } if (track_no == 3) { if (bars > 4 ) { // s(); } if (bars == 6) { transition(); } } if (track_no == 4) { if (mem["start_snare"]) { p(2); } } if (track_no == 5) { if (bars > 12) { p(3) } } if (track_no == 6) { // p(4, "C3") } } if (count == (mem["k_last"] + 3)) { pn("h"); } ``` |
>
>
|
<
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
<
<
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<
<
<
<
<
<
<
<
<
<
<
<
<
<
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
...
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
|
# Getting Started ## Tutorial <iframe width="560" height="315" src="https://www.youtube.com/embed/o683v4dt6RM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> This illustrates the core concepts of bitrhythm. 1. Samples (Tone.Sampler) 2. Dials (use cellx internally) 3. Observers (cellx) See <https://tonejs.github.io/> for more notes. For an understanding of the global variables see the concepts and code walkthrough section. - patterns and track_no - isHit, delta - samples - dials - Tone - cellx - window and any thing included with the script tag is available here `mem` is short for memory. All instruments and effects are saved here so that they can be accessed everywhere. Step to create the basic song. 1. Click on `Add Sample URL` to add the following URLs - /Kick01.wav - /Snare19.wav - /Closedhat01.wav - /MiscSynthStab04.wav 2. Click on `Add Dial` 3. Enter the following into the window ``` scene1 = [ cellx("p 1000 1000 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0000 x000 0000 x000"), ] scene2 = [ cellx("p 1011 1001 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0000 x000 0000 x000"), ] patterns = scene1 var once = function () { Tone.Master.volume.value = -30 mem.master = new Tone.Channel({channelCount: 2, volume: -10}).chain( Tone.Destination); mem.volume_guard = guard([-20,-10]); Sample("k", 0); Sample("h", 1); Sample("sn", 2); handlers["ex"] = function (val) { if (val > 0.5) { mem["start_snare"] = true; } } dials[0]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); handlers["ex"](val); }) } if (bars <= 3 ) { transition = once; } else { transition = tweak; } if (isHit) { if (track_no == 1) { p(0); } if (track_no == 2) { p(1); } if (track_no == 3) { if (mem["start_snare"]) { p(2); }; } } ``` Now try changing the code. ``` patterns = scene2 ``` Increase the dial to see the addition of the snare. This is how you can use observers to trigger unrelated changes. I call them sideevents, as the logic is similar to sidechain, which typically observers the volume. Comment and Uncomment lines in the `if (isHit)` block. To mute and unmute sections. *Note:* `mem["k0_channel"].solo = true;` is not working. **Visuals** Change the once function to this and click `+ Execute Once` Code is taken from butterchurn. Try changing [presets](https://butterchurnviz.com/) to get different visuals. ``` var tweak = function() { initWinamp("_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"); render_loop = function () { window.visualizer.render(); } } ``` **Tweaking** First click `+ Number`. This is useful to check if the knob function is actually working. And click `+ Execute Once` ``` var tweak = function () { mem.k1 = knob({ramp : [0.09,1.8, 0.4, 2, 1.5, 1, 0.5, 3, 5, 8, 2], "number": numbers[0]["v"] }); always = function () { mem["k0_filter"].frequency.value = mem.k1.move() * 1000; } } ``` As you can sere numbers and dials will be available as a global array. There is no way to remove them so be careful about the order in which you add them. The following code will always be executed as its at the top level. As you can see this code implies that the first dial is connected to the master volume. Use guards to avoid going deaf as someundefineds editing can created bad frequency numbers. ``` Tone.Master.volume.value = volume_guard((1 - dials[0]["cell"]()) * -30); ``` ### Making a basic loop - Kick + Filter - Snare + Filter - Snare + Filter + Delay - High Hat - Lead + Filter - Dub Stab + Filter + Reverb Tip: In Tone.js you can't call connect one after another, you need to use chain. TODO: Add glide to Lead to make it more 303 sounding Master is connected with Surround and Volume Limiter. Use Gates and Limiters to avoid going deaf. Tone.MultiInstrument gave lots of glitches, so custom voices are written in the voice function Channels provide - Mute - Solo More improvements for the Stab - Chorus or Phaser - Compressor - Decay in envelope - Separate filters - EQ - Sends for more delay - LFO for filters Freeverb does not work and also needs Mono to function properly ``` var reverb = new Tone.Freeverb().toDestination(); var reverb_mono = new Tone.Mono().connect(reverb); reverb.dampening = 100; reverb.roomSize = 0.9; ``` ### Full Code ``` volume_guard1 = guard([-20,15]) Tone.Master.volume.value = volume_guard1(Math.round(dials[0]["cell"]() * 30) -20); // mem["stab_channel"].volume.value = volume_guard2(-2); // mem["stab_filter"].frequency.value = Math.round(dials[1]["cell"]() * 10000); scene1 = [ cellx("p 1000 1000 1000 1000"), cellx("p 00x0 00x0 00x0 00x0"), cellx("p 0x00 0000 0000 x000"), cellx("p 0000 x000 0000 x000"), cellx("p xx0x c0x0 x0x0 x0xx"), cellx("p x000 x0x0 0000 x0x0"), ] patterns = scene1 function NoiseSynth (name) { name = name || "wf"; mem[name + "_stereo"] = new Tone.StereoWidener({width: 1}); mem[name] = new Tone.Noise("pink").start(); mem[name + "_filter"] = new Tone.Filter(400, 'lowpass', -96); mem[name + "_channel"] = new Tone.Channel({channelCount: 2, volume: -10, pan: -0.8}).chain(mem[name + "_filter"], mem[name + "_stereo"], mem.master); mem[name].connect(mem[name + "_channel"]) } function Stab(name) { name = name || "stab"; mem[name + "_filter"] = new Tone.Filter(5250, 'lowpass', -96); mem[name + "_hfilter"] = new Tone.Filter(80, 'highpass', -96); mem[name + "_reverb"] = new Tone.Reverb(0.1); mem[name + "_delay"] = new Tone.FeedbackDelay("4n", 0.4); // mem[name + "_pdelay"] = new Tone.PingPongDelay("2n", 0.1); mem[name + "_stereo"] = new Tone.StereoWidener({width: 0.25}); mem[name + "_channel"] = new Tone.Channel({channelCount: 2, volume: -2}).chain(mem[name + "_filter"] , mem[name + "_delay"], mem[name + "_reverb"], mem[name + "_hfilter"] ,mem[name + "_stereo"], mem.master) function voice(no, type) { mem[name + "_synth" + no] = new Tone.MonoSynth({ oscillator: { type: type } }) mem[name + "_synth" + no].connect(mem[name + "_channel"]); } voice(1, "sawtooth") voice(2, "sawtooth") voice(3, "sawtooth") voice(4, "pwm") voice(5, "pwm") voice(6, "pwm") } function s(vel, notes, duration) { vel = vel || 1.0; duration = duration || "2n"; notes = notes || ["E2", "B2", "G2"]; mem["stab_synth1"].triggerAttackRelease(notes[0], duration, undefined, vel); mem["stab_synth2"].triggerAttackRelease(notes[1], duration, undefined, vel); mem["stab_synth3"].triggerAttackRelease(notes[2], duration, undefined, vel); mem["stab_synth4"].triggerAttackRelease(notes[0], duration, undefined, vel); mem["stab_synth5"].triggerAttackRelease(notes[1], duration, undefined, vel); mem["stab_synth6"].triggerAttackRelease(notes[2], duration, undefined, vel); } function once() { var pr; const s = ( p ) => { pr = p; var img; let x = 100; let y = 100; p.setup = function() { var x = p.createCanvas(700, 410); x.canvas.style.position = "absolute"; p.frameRate(30); img = p.loadImage('/test.png'); }; p.draw = function() { var e = getRandomInt(2); p.clear(); if (e == 0) { // p.fill(123); // p.rect(x,y,50,50); } else { // p.image(img, 0, 0); } }; }; let myp5 = new p5(s, document.getElementById('canvas-container')); var visualizer = initWinamp("_Aderrasi - Wanderer in Curved Space - mash0000 - faclempt kibitzing meshuggana schmaltz (Geiss color mix)"); render_loop = function () { visualizer.render(); } Tone.Master.volume.value = -30; mem.master = new Tone.Channel({channelCount: 2, volume: -10}).chain(Tone.Destination); // NoiseSynth(); Stab(); Sample("k", 0, 3000, 3); Sample("h", 1, 7000, -15); Sample("sn",2, 6000, -15); Sample("c", 3, 620, 2); Sample("l", 4, 420, -15); handlers["1"] = function (val) { if (val > 0.5) { mem["start_snare"] = true; } else { mem["start_snare"] = false; } mem["stab_filter"].Q.value = Math.round(val * 5); } dials[1]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); handlers["1"](val); }) } function tweak () { mem.k1 = knob({ramp : [0.525, 0.8, 0.4, 1, 0.25, 0.75, 1, 0.25, 0.1], "number": dials[2]["cell"] }); always = function () { mem["stab_filter"].frequency.value = mem.k1.move() * 10000; } } if (bars <= 3 ) { transition = once; } else { transition = tweak; } if (isHit) { if (track_no == 1) { if (bars > 0 ) { p(0); } } if (track_no == 2) { if (bars > 8 ) { p(1); } } if (track_no == 3) { if (bars > 4 ) { // s(); } if (bars == 6) { transition(); } } if (track_no == 4) { if (mem["start_snare"]) { p(2); } } if (track_no == 5) { if (bars > 12) { p(3) } } if (track_no == 6) { // p(4, "C3") } } if (count == (mem["k_last"] + 3)) { pn("h"); } ``` ## Demo Song 1 // Techno <iframe width="560" height="315" src="https://www.youtube.com/embed/GTfmTMrSpag" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> Postprocessed using Reaper with EQ and Surround effects to add some sparkle. Video is recorded with the help of Blackhole and Kap and rendered by Reaper. Samples taken from Deep Techno and Dub Techno collections from splice. Sadly I can't distribute the song itself as I would also have to distribute the samples with it. Code for the Demo Song. The visualisation was disabled in the Demo as it was causing a huge lag while recording on both windows and mac. Note: Could could be outdated due to latest changes to the API. ``` volume_guard1 = guard([-20,15]) volume_guard2 = guard([-20,15]) ................................................................................ p(6, "C3", "48n") } } } ``` ## Demo Song 2 // UK Hip Hop <iframe width="560" height="315" src="https://www.youtube.com/embed/9eaABgJJlUo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> ```js volume_guard1 = guard([-20,15]) Tone.Master.volume.value = volume_guard1(Math.round(dials[0]["cell"]() * 30) -20); intro = [ cellx("p x000 0000 0000 0000 "), ] main = [ cellx("p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "), cellx("p 0000 x000 0000 x000 "), cellx("p x0x0 x0x0 x0x0 x0x0 "), cellx("p x000 0000 0000 0000 "), cellx("p 0000 0000 0000 0000"), cellx("p 0000 0000 0000 0000"), ] bass = [ cellx("p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "), cellx("p 0000 x000 0000 x000 "), cellx("p x0x0 x0x0 x0x0 x0x0 "), cellx("p x000 0000 0000 0000 "), cellx("p x[^B2]x.00 x[^B2]x.x[^B2]x. x[^B2]x.x[^B2]x.x[^B2]x.0 "), cellx("p 00x[^D3]0 000x[^A2] 00x[^A2]x[^A2] 0x[^A2]0x[^A2] "), ] end = [ cellx("p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "), cellx("p 0000 x000 0000 x000 "), cellx("p x10x0 x0x0 x0x0 x0x0 "), ] solo = [ cellx("p 0000 0000 0000 0000"), cellx("p 0000 0000 0000 0000"), cellx("p 0000 0000 0000 0000"), ] fin = solo; endgame = [ cellx("p x[2;^C2;+0.01]000 0000 x[0.1]0x[1]0 00x[1]0 "), cellx("p 0000 x000 0000 x000 "), cellx("p x0x0 x0x0 x0x0 x0x0 "), cellx("p x000 0000 0000 0000 "), cellx("p x[^B2]x.00 x[^B2]x.x[^B2]x. x[^B2]x.x[^B2]x.x[^B2]x.0 "), ] empty = cellx("p 0000 0000 0000 0000") function once () { const setup = ( instance ) => { var intro = [] var main = [] var bass = main var end = [] var solo = end var fin = end var count = 0; var old_scene = ""; let x = 100; let y = 100; instance.setup = function() { var x = instance.createCanvas(1280, 410); x.canvas.style.position = "absolute"; instance.frameRate(0.25); intro.push(instance.loadImage('/closed/intro/1.png')); main.push(instance.loadImage('/closed/main/1.png')); main.push(instance.loadImage('/closed/main/2.png')); main.push(instance.loadImage('/closed/main/3.png')); main.push(instance.loadImage('/closed/main/4.png')); main.push(instance.loadImage('/closed/main/5.png')); main.push(instance.loadImage('/closed/main/6.png')); main.push(instance.loadImage('/closed/main/7.png')); end.push(instance.loadImage('/closed/end/1.png')); }; instance.draw = function() { if (old_scene != current_scene) { old_scene = current_scene; count = 0; } instance.clear(); var c = eval(`${current_scene}`) instance.image(c[count], 0, 0); count += 1 count = count % c.length; }; }; let myp5 = new p5(setup, document.getElementById('canvas-container')); Tone.Master.volume.value = -30 dials[2]["cell"](1) mem["master_filter"] = new Tone.Filter(10000, 'lowpass', -96); mem["master_stereo"] = new Tone.StereoWidener({width: 0.50}); dials[2]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); var cutoff_guard = guard([10, 20000]); mem["master_filter"].frequency.value = cutoff_guard(val * 10000); }) dials[3]["cell"](0) dials[3]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); var volume_guard1 = guard([0,1]) audio.master.in.gain.value = volume_guard1(val / 10); }) mem.master = new Tone.Channel({channelCount: 2, volume: -10}).chain( mem["master_filter"], mem["master_stereo"], Tone.Destination); Sample("k", 0, null, -5); Sample("sn1",1, null, 0); Sample("h",2, 5000, -35); Sample("m",3, null, -15); Sample("f",4, null, -15); name = "s" filter = 2000 volume = -15 mem[name + "_filter"] = new Tone.Filter(filter, 'lowpass', -96); mem[name + "_delay"] = new Tone.FeedbackDelay("4n", 0.4); mem[name + "_channel"] = new Tone.Channel({channelCount: 2, volume: volume, pan: -0.25}).chain(mem[name + "_filter"], mem[name + "_delay"], mem.master) samples[5].connect(mem[name + "_channel"]); hit_map[name] = 5; Sample("manager",6, null, -5); Sample("order",7, null, -15); Sample("cr",8, null, -15); Sample("piano",9, 400, -5); Sample("sitar",10, 5000, -15); const audio = Audio(); const three = ThreeOhUnit(audio, "sawtooth", { "cutoff": 78, "resonance": 15, "envMod": 4000, "decay": 0.5 } ) audio.master.in.gain.value = 0; mem["three"] = three // cutoff [30, 700], 400 // resonance: [1, 30], 15 // envMod: [0, 8000], 4000 // decay: [0.1, 0.9], 0.5 dials[1]["cell"](0.07825) dials[1]["cell"].onChange(function (e) { var val = parseFloat(e["data"].value); cutoff_guard = guard([30, 700]); three.params.cutoff.value = cutoff_guard(val * 1000); }) mem.k1 = knob({ramp : [0.525, 0.8, 0.4, 0.25, 0.75, 0.25], step: 0.005, "number": dials[1]["cell"] }); always = function () { let cutoff_guard = guard([30, 900]); three.params.cutoff.value = cutoff_guard(mem.k1.move() * 1000); } } function tweak() { var snare_count = cellx(0); snare_count.onChange(function (e) { var val = parseInt(e["data"].value); if (val == 22) { current_scene = "fin"; p1(8, null, null, 12.25); } }) Mousetrap.bind(['f2'], function(e) { snare_count(snare_count() + 1) if (snare_count() <= 20) { setTimeout(function () { p(0, null, null, "24n", null ); setTimeout(function () { p(8, null, null, "2n" ); p(10, 0.5, "A2", 1); }, delta * 2) }, delta * 1.5) } return false; }) } transition = once; if (bars <= 2) { current_scene = "intro"; } else { // mem["three"].step("off"); if (bars == 3) { eval_guard ? cue("Start intro") : ""; current_scene = "intro"; } if (bars == 5) { eval_guard ? cue("Start drums") : ""; current_scene = "main"; } if (bars == 12) { eval_guard ? cue("Add bass"): ""; current_scene = "bass"; } if (bars == 32) { eval_guard ?cue("Reverse "): ""; current_scene = "bass"; } if (bars == 42) { eval_guard ? cue("End "): "" current_scene = "end"; } if (bars == 48) { eval_guard ? cue("Solo "): "" current_scene = "solo"; } transition = tweak; } patterns = eval(`${current_scene}`); always(); if (track_no == 1) { if (count == 0) { cue("Sample") p1(7, null, null, 12.25); } } if (isHit) { if (current_scene == "intro") { if (track_no == 1) { p(3, null, null, "1n"); } } else if (current_scene == "fin") { } else if (current_scene == "solo") { } else if (current_scene == "end") { if (track_no == 1) { p(0, meta[tick]["volume"], meta[tick]["pitch"], "24n", meta[tick]["delay"] ); } if (track_no == 2) { p(1); } if (track_no == 3) { p(2) } } else if (current_scene == "main") { if (track_no == 1) { p(0, meta[tick]["volume"], meta[tick]["pitch"], "24n", meta[tick]["delay"] ); } if (track_no == 2) { p(1); } if (track_no == 3) { p(2) } if (track_no == 4) { p(3, null, null, "1n"); } if (track_no == 5) { if (meta[tick]["pitch"]) { // mem["three"].step({"glide": true, "accent": false, "note": meta[tick]["pitch"]}); } else { // mem["three"].step("off"); } } if (track_no == 6) { p(5, null, meta[tick]["pitch"], "1n"); } } else if (current_scene == "bass") { if (track_no == 1) { p(0, meta[tick]["volume"], meta[tick]["pitch"], "24n", meta[tick]["delay"] ); } if (track_no == 2) { p(1); } if (track_no == 3) { p(2) } if (track_no == 4) { p(3, null, null, "1n"); } if (track_no == 5) { if (meta[tick]["pitch"]) { mem["three"].step({"glide": true, "accent": false, "note": meta[tick]["pitch"]}); } else { mem["three"].step("off"); } } if (track_no == 6) { // p(5, 0.15, meta[tick]["pitch"], 1); // p(9, 1, meta[tick]["pitch"], 1); } } } ``` |
Changes to source/limitations.md.
1 2 3 4 5 6 7 8 9 10 |
# Limitations and Recording - Opening developer tools might slow down the execution a bit - Using excessive delays and reverbs seems to cause some glitches - Mobile browsers don't work properly - Firefox does not seem to work well with tone.js I use [BlackHole](https://existential.audio/blackhole/) to record audio from the browser window to Reaper. You can use any screenrecording software to record the screen. Have a distinct sound to match both audio and video. |
| > > > > |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
# Saving and other limitations There is a save button that converts the state of bitrhythm into a url paramter. This means there is an upper limit on how much code you can write, making it useful for demoscene like situations. You can share the url with tinyurl. You can also download the file. Please keep a backup. - Opening developer tools might slow down the execution a bit - Using excessive delays and reverbs seems to cause some glitches - Mobile browsers don't work properly - Firefox does not seem to work well with tone.js I use [BlackHole](https://existential.audio/blackhole/) to record audio from the browser window to Reaper. You can use any screenrecording software to record the screen. Have a distinct sound to match both audio and video. |
Changes to source/main.cog.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .... 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 .... 1360 1361 1362 1363 1364 1365 1366 1367 1368 1369 1370 1371 1372 1373 1374 1375 1376 1377 1378 1379 .... 1568 1569 1570 1571 1572 1573 1574 1575 1576 1577 1578 1579 1580 1581 1582 |
@< @> This is just a sample Copyright (C) 2021 Xyzzy Apps See https://bitrhythm.xyzzyapps.link/docs/source-code.html for the latest source code @@ # Concepts and Code Walkthrough @< import cog import os if DEV == "1": stuff = """ ................................................................................ </script> </head> <body> <div class="containera-full"> <hstack class="mb-2"> <h5 class="ml-4"><a href="/docs/index.html" target="_blank">Docs + Demo</a></h5> <h5 class="ml-4"><a href="/song/XQAAAAJwFAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9NTfIT-_uEg-npGX0y9CmzyyVpwgaOUrKNlF-pzVXf3YnQ2gSfpzY3zlYLujavQRq73hSEM-RaGxTxuud9nauG_VdXCmE_lvZ88XvUHOIGjOkCUKV-1ot3i9fx5NP-UsUmVpnjUDnq_9eUJfonx5B_oG4c3GvLitNREl_O9emU8CST0v5RVqHSudqZqsrortpDjdMlekhQ2y7ZlNcUDjGoTrH4vFMrLVI60wINoufS0iO6ourxizS1Ifv_iirkdP0U0Zp21rHHKXlwhWG0hmTCxYo8ZIf0Cmbiu22GiFFmRfIcuWbcq-_SWdyMJ0sWIslhKpGFEapN604eNblpy5im2PsItjWScu-cS0JI3zeHb8JMNzWflq0-XWHG5WLsmPqCbn3GgfR6BiAx1ApmTui84WXgX6SuJPkXRqHEOKpBZ4dKEPr5P_-DDpwz0L7i8X_FHE-LBMactDBoKgIbIoyVnRe6DJ9s5AZLJjUrWGGVCLcp5bEKOnH_3HfZuDq9UlOvZRVkz3BwpUeajLeUJcAYxDmU2JbNUaipMJN7LF9YAX2LaT44LACw2A7Is-pQ_EGznjhEo7SS7JusQPN6G43g4OUZSUY5WNlPUCWfXSeWNU0Xx_-b4r6t4HHQS2P2stIQOS96JqLzXrx-Q62Y8RSRIvieE76j_-dw4icTDiATfx8doLkSzXgOzNTcZYume2cHLEG-0TbgR1M6WCPiH4pvHIRfcTxEDZK5b7iqIhY0MNW8Kkyn7KFVqQf_5d_msiv57DWIHg6Qi6cmBdOF0Li_CY8kFBV4BWLsOlanN6_hehIREVU8WgWbM9rdrKcqzhHD8Fp5qTmbyiVnjD83BDhKY5zwF8xFM1p7ZmEjlIF1ag62BDRt5j_MZ9q5COsX9gpV6DfA0FaDwyOmkMsOFiGeUNIr8B_ENYG-EpYbhUHZukv-QttcjFwRypF1eSN3DMrGUm1eB62PW3s--XcugwT5GJQRa66WZF4DZzPPTKEZhtNL28KgBcHm3DeuSfN_HRsgBW1o2YDpM1QP-K0aedKB_umlWhdBze7Gs72-vDfjB6LGI__tncLNS3GaqYaltFnzc64EOV-mz1xvlyAuFSj-T8r8e5ebJky7o6PZXPTvvCLeTL056Tpp-Gh-WgxmyMISIhkb5kKPj235H7OY-JAoT28VVrA01WpXoArOJaE2ijBt2oLOYXwWiO1hUI3NtTO2vI__sllxHNHS6EiHXPyLj8_PGF47RUq7oc-9ibiF9FUuoonMLE0PwyGOUJ6LU9SDb4FLPwk0gJBP4GiWLftvfErrXDNck9O6_JZvpJ_9O5qmNDUge5yDYbO__vJejx0bomU7eG2kuvPAmGtiWrYo8B_3JoEAOMgVa9SxE4kZ-ijdh-glIKredlMCUG5eYJc-6H_94pteyO-ocB8rrlfSGr6M2r9xlbeMecCvJTRjmwMbB12DWGbDq5Sxn8tgX98O9lT-51_oajqKVMmox3f7kXhsJPxyIMsUaVVFRmpPJvMt5nt9-i1Vgmux4a3t7a1oVPdN35POOjun63NkyODKhTUHmjdC7h9tv6ZI8WPf2Gh9__k6qf5xp3u3OjzkISj7ainHooji_3Cnjm3T30e6pm3MhliJg1ezFi8NetUwwYZz6UNCMOTUaWAqJ5BmF2hAh5Sdsog93orRvrOuPTNhRA1Wlyjrsy8zVW3WlO4chcKVYA0OsH1Zwjo7koXbfX7ERrPnAbZsWfkPePwI4to-KuPF1v0U4jwFelzwn3n4C1E2BkqPfNcvnVlFDmPHlyOCZHrfsrG9GUPsCrZdrX2EHiWH_bRkXVJwkHTLir8d_cjI0DIrVYji4XBIDX9Pmt-0ylr0FeHLXVHNb4Q7V--3d4-mJ2zXsZDR97M_ikaQVHZBWcKnyWmx_aPoWKnFYkk_6PbR246YU3fViA9PdZKTYrN2B3KmcrliH2T2YRcRdWQGxXlXZh3Bsd5PtOC1EuV7-DHlkI67D6V-AFScJfdj64Pv1wKwGQZ7lEZtrmv_VVRmkWYWFtbBj5HHnth1sKhBjVgGIVH74y9b0hHjpo5kw-1_3jNZ1ooxp-y8FTHblmSkSoQe8bey9XQ7BxGbUPsG0X5LfT8FpZH36A6Vz6nedFEvuoQCyV55qcnDD5IKsJeyKZz1ugrYGoZIfJMr1XTiulWUiaxeat7Q6Xq1YXOjvWV7ki_w4m__-wVP5g">Tutorial</a></h5> <h5 class="ml-4"><a href="/song/XQAAAAInBwAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9OTB7Y34cZmeLb5MKZic7bXMO7vWrjHyfc2FvIP0v1Gp--NY5tUsY7sQ71Zzph5WmKUZ2oNtnxz8-HaVpK1SGQzEOq3-lWkeJ76a2J8Ng2OEZxOMNAk6VTnu8fRRTToMlowDe3wjs8DorsxdnW49ThFhGbOek4QAwzPneapDmjuDKRqiqN3btgnfZDzokeOTh6CzwAI2rBbL07YUBEFaMziOJ_2X59eW5g03eCnL7GlOCk2u6_22WnYgZPbc3RuJLf8JLAhbDrXvZHyYekrPuGo_R6V2BCPE14rZFFwJQWEqy_KDtH_YPMhj1TPS62qcPr6qAWrI9nsndpRrczwBFChHSPKiZXjCZJZKH1Kh19A4-vpXwbr1BCiNdOTQ89KKv0OXpIFUMwx5Qd5jsrb2c-hywM688F9TJtPD1rEewoJTzhpRrD0wuMN5kqGTvR2iDS2BFmWQl0GGgvUAT6D640GnQYMCeTfwpSTG7Wnq_PboBCyG_2-kdbDDHL4zgalHx4cqxZhEyUZT6bcp-kPiYnAeWzCn7Sj085jX-Cc40akEEZgjYSrwUisGwSOiePi8t-eQ5P-akBrtCgHdmnQ7rfsErnufae_Ydu2dlElNjDgk2c9CJus8ihzwpGF6FEIRuZqplgDOAgnUy9JPurT8H4dKaXV3DqhLxOhd2EGuELO7kgh67Zi_uvaOkMv1MU3VxwAnC41eJrW_VYum8p2cAvxdBi49jJZ1z9yhZAwQIYfxdSq5ECX-G7FX2drYkAYexBBepkbQzSnPrR3s5xsIRraOIbtQZwIOTfyGvTuHMrO4LlOE4Llpqt549tLwGYs0mrWp6bYksGQHS8fgAIFHyoua3VtyjlgCLaQGi8nJxp0TgsZQ60wPXf7GyXxcZ-bVZSVHGskukkCwhCuggcS_8rA6kA">Demo Song</a></h5> <h5 class="ml-4" ><a href="https://xyzzyapps.link/samples/" target="_blank">Sample Browser</a></h5> </hstack> <bitrhythm song="{{data}}"></bitrhythm> </div> <script> riot.compile(function() { ................................................................................ } else { return state; } } } function romantogypsy(hex) { var letters = hex.replace('`1','a'); letters = letters.replace('`2','b'); letters = letters.replace('`3','c'); letters = letters.replace('`4','d'); letters = letters.replace('`5','e'); letters = letters.replace('`6','f'); return letters; } function lettertodec(letter) { var bin = ""; if (letter.match(/\d/)) { no = parseInt(letter); ................................................................................ } } } return meta; } window.pattern_meta = pattern_meta; function cue(html, seconds = 5) { $("#cued").html(html); setTimeout(function () { $("#cued").html(""); }, seconds * 1000) |
| | | | | | | | | | | < |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 .... 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 .... 1360 1361 1362 1363 1364 1365 1366 1367 1368 1369 1370 1371 1372 1373 1374 1375 1376 1377 1378 1379 .... 1568 1569 1570 1571 1572 1573 1574 1575 1576 1577 1578 1579 1580 1581 |
@<
@>
This is just a sample
Copyright (C) 2021 Xyzzy Apps
See https://bitrhythm.xyzzyapps.link/docs/source-code.html for the latest source code
@@
# Code Walkthrough
@<
import cog
import os
if DEV == "1":
stuff = """
................................................................................
</script>
</head>
<body>
<div class="containera-full">
<hstack class="mb-2">
<h5 class="ml-4"><a href="/docs/index.html" target="_blank">docs</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAJwFAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9NTfIT-_uEg-npGX0y9CmzyyVpwgaOUrKNlF-pzVXf3YnQ2gSfpzY3zlYLujavQRq73hSEM-RaGxTxuud9nauG_VdXCmE_lvZ88XvUHOIGjOkCUKV-1ot3i9fx5NP-UsUmVpnjUDnq_9eUJfonx5B_oG4c3GvLitNREl_O9emU8CST0v5RVqHSudqZqsrortpDjdMlekhQ2y7ZlNcUDjGoTrH4vFMrLVI60wINoufS0iO6ourxizS1Ifv_iirkdP0U0Zp21rHHKXlwhWG0hmTCxYo8ZIf0Cmbiu22GiFFmRfIcuWbcq-_SWdyMJ0sWIslhKpGFEapN604eNblpy5im2PsItjWScu-cS0JI3zeHb8JMNzWflq0-XWHG5WLsmPqCbn3GgfR6BiAx1ApmTui84WXgX6SuJPkXRqHEOKpBZ4dKEPr5P_-DDpwz0L7i8X_FHE-LBMactDBoKgIbIoyVnRe6DJ9s5AZLJjUrWGGVCLcp5bEKOnH_3HfZuDq9UlOvZRVkz3BwpUeajLeUJcAYxDmU2JbNUaipMJN7LF9YAX2LaT44LACw2A7Is-pQ_EGznjhEo7SS7JusQPN6G43g4OUZSUY5WNlPUCWfXSeWNU0Xx_-b4r6t4HHQS2P2stIQOS96JqLzXrx-Q62Y8RSRIvieE76j_-dw4icTDiATfx8doLkSzXgOzNTcZYume2cHLEG-0TbgR1M6WCPiH4pvHIRfcTxEDZK5b7iqIhY0MNW8Kkyn7KFVqQf_5d_msiv57DWIHg6Qi6cmBdOF0Li_CY8kFBV4BWLsOlanN6_hehIREVU8WgWbM9rdrKcqzhHD8Fp5qTmbyiVnjD83BDhKY5zwF8xFM1p7ZmEjlIF1ag62BDRt5j_MZ9q5COsX9gpV6DfA0FaDwyOmkMsOFiGeUNIr8B_ENYG-EpYbhUHZukv-QttcjFwRypF1eSN3DMrGUm1eB62PW3s--XcugwT5GJQRa66WZF4DZzPPTKEZhtNL28KgBcHm3DeuSfN_HRsgBW1o2YDpM1QP-K0aedKB_umlWhdBze7Gs72-vDfjB6LGI__tncLNS3GaqYaltFnzc64EOV-mz1xvlyAuFSj-T8r8e5ebJky7o6PZXPTvvCLeTL056Tpp-Gh-WgxmyMISIhkb5kKPj235H7OY-JAoT28VVrA01WpXoArOJaE2ijBt2oLOYXwWiO1hUI3NtTO2vI__sllxHNHS6EiHXPyLj8_PGF47RUq7oc-9ibiF9FUuoonMLE0PwyGOUJ6LU9SDb4FLPwk0gJBP4GiWLftvfErrXDNck9O6_JZvpJ_9O5qmNDUge5yDYbO__vJejx0bomU7eG2kuvPAmGtiWrYo8B_3JoEAOMgVa9SxE4kZ-ijdh-glIKredlMCUG5eYJc-6H_94pteyO-ocB8rrlfSGr6M2r9xlbeMecCvJTRjmwMbB12DWGbDq5Sxn8tgX98O9lT-51_oajqKVMmox3f7kXhsJPxyIMsUaVVFRmpPJvMt5nt9-i1Vgmux4a3t7a1oVPdN35POOjun63NkyODKhTUHmjdC7h9tv6ZI8WPf2Gh9__k6qf5xp3u3OjzkISj7ainHooji_3Cnjm3T30e6pm3MhliJg1ezFi8NetUwwYZz6UNCMOTUaWAqJ5BmF2hAh5Sdsog93orRvrOuPTNhRA1Wlyjrsy8zVW3WlO4chcKVYA0OsH1Zwjo7koXbfX7ERrPnAbZsWfkPePwI4to-KuPF1v0U4jwFelzwn3n4C1E2BkqPfNcvnVlFDmPHlyOCZHrfsrG9GUPsCrZdrX2EHiWH_bRkXVJwkHTLir8d_cjI0DIrVYji4XBIDX9Pmt-0ylr0FeHLXVHNb4Q7V--3d4-mJ2zXsZDR97M_ikaQVHZBWcKnyWmx_aPoWKnFYkk_6PbR246YU3fViA9PdZKTYrN2B3KmcrliH2T2YRcRdWQGxXlXZh3Bsd5PtOC1EuV7-DHlkI67D6V-AFScJfdj64Pv1wKwGQZ7lEZtrmv_VVRmkWYWFtbBj5HHnth1sKhBjVgGIVH74y9b0hHjpo5kw-1_3jNZ1ooxp-y8FTHblmSkSoQe8bey9XQ7BxGbUPsG0X5LfT8FpZH36A6Vz6nedFEvuoQCyV55qcnDD5IKsJeyKZz1ugrYGoZIfJMr1XTiulWUiaxeat7Q6Xq1YXOjvWV7ki_w4m__-wVP5g">techno</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAIbCAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9OTB7Y34cZmeLb5MKZic7bXMO7vWrjHyfc2FvIP0v1Gp--NY5tUsY7sQ71Zzph5WmKUZ2oNtnxz8-HaVpK1SGQzEOq3-lWkeJ76a2J8Ng2OEZxOMNAk6VTnu8fRRTToMlowDe3wjs8DorsxdnW49ThFhGbOek4QAwzPneapDmjuDKRqiqN3btgnfZDzokeOTh6CzwAI2rBbL07YUBEFaMziOJ_2X59fYBPM3eCnL7GlOCk2u6_22WnYgZPbc3RuJLf8JLAhbDrXvZHyYekrPuGo_R6V2BCPE14rZFFwJQWEqy_KDtH_YPMhj1TPS62qcPr6qAWrI9nsndpRrczwBFChHSPKiZXjCZJZKH1Kh19A4-vpXwbr1BCiNdOTQ89KKv0OXpIFUMwx5Qd5jsrb2c-hywM688ClZ86A5o4KzrE2xjG4VbcexmPdOXS-K6PRU4c6dJOUClOLNZpbmZvL8Bo4ep67wL0bFEOMqhN30pLGmZlnfd5mgH8J9dPrGsEglKLGskQ_g2vEeR9CzOstzctjCKtL1O8oNkSuCnXSGE0uY5rxGmBu7AW99tRx0i8hNzB4l1S1mxnzkLefi9VM6YYZraX7T2kGnRgD5HOg0WH2LeUsVuWpnp189Ph_Os95_XUVBc67TwU8IWbzat1decCt0jKKP13L7a0OCO18Fq2DVr9veHq2mRepiObWGsYcqjXkUNjaxoItg_pWdK6gyveVXjfs3PaJ477UbpiZBWxoc-Ebn8FZu6bZZ4gOZE-MoJHUDiQZgo3-lirXTvpcpsgsaIUESDAcGUNE4aIK6wIFGnEaEFYo4veQqTLeic4NhPtUpTdfRqdNTKOaVSUE_KGXKXaZl0Eni1DBmEGykml4uxHsWBEE44Ku34YIb6KZUcCu2DuXDiXcbabsWkA-czXWBtRnzWJ6ib4scny1o6CsVnugUjE9wv84bz2">chiptune</a></h5>
<h5 class="ml-4" ><a href="https://xyzzyapps.link/samples/" target="_blank">sample browser</a></h5>
</hstack>
<bitrhythm song="{{data}}"></bitrhythm>
</div>
<script>
riot.compile(function() {
................................................................................
} else {
return state;
}
}
}
function romantogypsy(hex) {
var letters = hex.replace('`0','a');
letters = letters.replace('`1','b');
letters = letters.replace('`2','c');
letters = letters.replace('`3','d');
letters = letters.replace('`4','e');
letters = letters.replace('`5','f');
return letters;
}
function lettertodec(letter) {
var bin = "";
if (letter.match(/\d/)) {
no = parseInt(letter);
................................................................................
}
}
}
return meta;
}
window.pattern_meta = pattern_meta;
function cue(html, seconds = 5) {
$("#cued").html(html);
setTimeout(function () {
$("#cued").html("");
}, seconds * 1000)
|
Changes to source/main.md.
1 2 3 4 5 6 7 8 9 ... 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 .... 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 1120 |
# Concepts and Code Walkthrough ## Core Tracker Loop In bitrhythm code is evaluated for every cycle. 1 beat = 60 / tempo ................................................................................ } else { return state; } } } function romantogypsy(hex) { var letters = hex.replace('`1','a'); letters = letters.replace('`2','b'); letters = letters.replace('`3','c'); letters = letters.replace('`4','d'); letters = letters.replace('`5','e'); letters = letters.replace('`6','f'); return letters; } function lettertodec(letter) { var bin = ""; if (letter.match(/\d/)) { no = parseInt(letter); ................................................................................ } } } return meta; } window.pattern_meta = pattern_meta; function cue(html, seconds = 5) { $("#cued").html(html); setTimeout(function () { $("#cued").html(""); }, seconds * 1000) |
| | | | | | | < |
1 2 3 4 5 6 7 8 9 ... 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 .... 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 |
# Code Walkthrough ## Core Tracker Loop In bitrhythm code is evaluated for every cycle. 1 beat = 60 / tempo ................................................................................ } else { return state; } } } function romantogypsy(hex) { var letters = hex.replace('`0','a'); letters = letters.replace('`1','b'); letters = letters.replace('`2','c'); letters = letters.replace('`3','d'); letters = letters.replace('`4','e'); letters = letters.replace('`5','f'); return letters; } function lettertodec(letter) { var bin = ""; if (letter.match(/\d/)) { no = parseInt(letter); ................................................................................ } } } return meta; } window.pattern_meta = pattern_meta; function cue(html, seconds = 5) { $("#cued").html(html); setTimeout(function () { $("#cued").html(""); }, seconds * 1000) |
Deleted source/saving.md.
1 2 3 4 5 6 7 |
# Saving and Sharing There is a save button that converts the state of bitrhythm into a url paramter. This means there is an upper limit on how much code you can write, making it useful for demoscene like situations. You can share the url with tinyurl. To make a complete song use `bars` to trigger multiple transitions. |
< < < < < < < |
Changes to source/tweaking.md.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
..
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
# What exactly is Tweaking ? For that you need some context. Historically speaking, music was an accompaniment for theatrical plays. A typical song has a Theme and develops Exposition / Conflict / Resolution through time. Its not a coincidence that the sonata and the dramatic structure share the same form. In a typical play you have scenes, transitions, sets in the background and characters in the foreground. While the play progresses and characters clash you get music alongside each of these elements. Every song has a title that guides the listener to what the song is about. Typical Scenes include intro, bridge, buildup, section, breakdown and climax. What is the intro about ? What is the bridge about ? What is the verse about ? What is the chorus about ? What are the sections about ? The essential question driving any story is how to be ? In a drama this question is answered with doubts, emotion, circularity, warnings from the chorus, exposition, rises, falls, reprisals, conclusions, contradictions, denouncements, confrontations, mistakes, reversals, recognition, revelation resolution, statements and breakdowns. Here another way of thinking about it. A song is about answering a question posed the title / intro perhaps. The question which the artist poses to the audience. Verses are the answers. Rhythm dictates the demarcates the flow of time and seasons. Modern music has evolved to be standalone but it retains elements of theatrical story telling. You can divide a song into verses and sections. In the documentation, we will use the terms from plays. Within each musical scene you typically have, - Background: You use layers of rhythm and groove to set the mood. - Foreground: Lead (Soliloquy), Counterpoint (Character Conflict), Call Response(Dialogues), Motif, Ornaments (Exposition) In Electronic Music, the foreground is mainly developed using Layers(polyrhythms) and Tweaking. Tweaking and Layers effectively function for the purposes of Exposition and Conflict. Chorus, Fade, Drop are used for transitions typically in electronic music. Tweaking is also called knob-twisting by hardware users. To compare the foreground in others, Classical Music: Counterpoint and Harmony Rock: Call Response Now EDM - Dub, Techno and Jungle - are distinct musical genres. What could they possibly share ? 1. All three uphold the primacy of Rhythm for start. 2. All three are instrumental. 3. Voices are used sparingly as samples. 4. All three have a tradition of live acts. 5. Dub Plates are common for these genres. 6. Melody is nothing but a repeating stab (motif) If you want to add a solo to EDM, you typically add a live instrument. Dub Music is made by messing with the Recording Engineer's Mixing desk. A prime example of tweaking. <iframe width="420" height="315" src="https://www.youtube.com/embed/oJs1wR8tLr4" frameborder="0" allowfullscreen></iframe> Techno is made by messing with Hardware or Hardware + Software. Tweaking + Layering. <iframe width="560" height="315" src="https://www.youtube.com/embed/ppEhaH3jSzo" frameborder="0" allowfullscreen></iframe> Jungle is used as a catch all for Breakbeat, Hardcore as well. Jungle Music is made by messing with Hardware + Software combo. Complex Layering is used here. <iframe width="560" height="315" src="https://www.youtube.com/embed/q72qoGYirwU" frameborder="0" allowfullscreen></iframe> Bitrhythm only supports rhythmic notations and is geared towards electronic music. My current goal is to produce an IDM track and Chiptune with it with complex rhythmic patterns. As for techno the current setup seems alright. Support will be added in the future for pitch manipulation in a different module or a different project. There is a piano module in the code with midi support but its currently deactivated. You can treat a musical scale as no different than a drumset. The pentatanic scale approximately maps to a drumset and you can use techniques from [melodic drumming](https://www.youtube.com/watch?v=1qdyxML4tF0) with multiple samples. This is typically how drummers approach guitars. ## Is Bitrhythm Maths heavy ? You will need some basic maths operations to understand and use bitrhythm effectively. These operations are about working with lists of numbers and lists of strings. Some common operations on lists include ................................................................................ 2. Neo-Riemannian_theory, Combinatory theory 3. Sacred Geometry 4. Circle of fifths, chord progressions 5. Set transformations like inversion on Scales 6. Licks from books 7. Randomness, I Ching, Playing Cards ## DJ Controls ```{todo} Expand ``` Essentially a DJ is like a conductor. Loops are like individual instrumentalists. 1. Cueing -> Mute / Solo 2. Dynamics -> Volume 3. Ornamentation -> Cutoff 5. Tempo, Beat Counting -> Beat Matching ## Music is arrangement <iframe width="420" height="315" src="https://www.youtube.com/embed/tprMEs-zfQA" frameborder="0" allowfullscreen></iframe> ## See Also In screenplays you also have a [setup / payoff](https://www.youtube.com/watch?v=cG5zKwmXLgo) dynamic. Setup - Obstacles - Challenges - Forces - Context |
|
|
|
|
>
>
>
>
|
|
<
>
<
<
<
<
<
>
|
|
|
|
<
<
<
>
<
>
>
<
>
<
>
>
|
<
>
|
|
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
..
86
87
88
89
90
91
92
|
# Core Features ## Sequencer Notation Bitrhythm only supports rhythmic notations and is geared towards electronic music. My current goal is to produce an IDM track, a DNB track and a Chiptune with complex rhythmic patterns. As for Techno the current setup seems alright but more support for DJ style transitions are needed. You can treat a musical scale as no different than a drumset. The pentatanic scale approximately maps to a drumset and you can use techniques from [melodic drumming](https://www.youtube.com/watch?v=1qdyxML4tF0) with multiple samples. This is typically how drummers approach guitars. ## Tweaking and Transitions These are key to making electronic music. Tweaking is also called Automation and knob-twisting by hardware users. Modern music has evolved to be standalone but it retains elements of theatrical story telling. You can divide a song into verses and sections. In the documentation, we will use the terms from plays - scenes. Within each musical scene you typically have, - Background: You use layers of rhythm and groove to set the mood. - Foreground: Lead (Soliloquy), Counterpoint(Character Conflict), Call Response(Dialogues), Motif, Ornaments (Exposition) In screenplays you also have a [setup / payoff](https://www.youtube.com/watch?v=cG5zKwmXLgo) dynamic. Setup - Obstacles - Challenges - Forces - Context In Electronic Music the foreground is mainly developed via Tweaking. Tweaking effectively functions for the purposes of Exposition and Conflict. Chorus, Fade, Drop are used for transitions typically in electronic music. To compare the foreground in others, Classical Music: Counterpoint and Harmony<br> Rock: Call Response<br> To make a complete song in bitrhythm use `bars` to trigger multiple transitions. Essentially a DJ is like a conductor. Loops are like individual instrumentalists. 1. Cueing -> Mute / Solo 2. Dynamics -> Volume 3. Ornamentation -> Cutoff 5. Tempo, Beat Counting -> Beat Matching <iframe width="420" height="315" src="https://www.youtube.com/embed/tprMEs-zfQA" frameborder="0" allowfullscreen></iframe> ## Is Bitrhythm Maths heavy ? You will need some basic maths operations to understand and use bitrhythm effectively. These operations are about working with lists of numbers and lists of strings. Some common operations on lists include ................................................................................ 2. Neo-Riemannian_theory, Combinatory theory 3. Sacred Geometry 4. Circle of fifths, chord progressions 5. Set transformations like inversion on Scales 6. Licks from books 7. Randomness, I Ching, Playing Cards |
Changes to source/what.cog.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
..
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
# What is bitrhythm about ? Currently this is how you can use code with music, 1. VST plugins 2. DAW scripting 3. Embedded code to interact with electronics 4. ML approaches 5. Live coding 6. Use some weird algorithms / number sequences / hardcoded chords / random numbers 7. Web Audio / Audio Programming languages Bitrhythm offers 4-7. In Bitrhythm you get a coding playground to explore and learn webaudio and webgl apis for the purposes of 1. live visual programming 2. live audio programming 3. music sequencing 4. interactive music 5. audio visualisation 6. music learning Apart from the core html apis, you can also use the following libraries 1. Tuna 2. Timbral 3. Tone.js 4. Underscore / Rambda 5. cellx 6. Magenta.js (Machine Learning) 7. P5.js / D3 8. Winamp Visualisations (butterchurn) ```{code-block} html --- force: true ................................................................................ @< import common cog.out(common.external_libraries) @> @@ ``` ## About Author I make [web apps](https://xyzzyapps.link) apps for a living. I started messing with algorithmic composition using pure data around 2011. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections. For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. [This library](https://www.youtube.com/watch?v=adz1Gv5Lm34) in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker. After my initial work on the project in 2019, the project got sidetracked. After seeing [endless acid banger](https://www.vitling.xyz/toys/acid-banger/) I had an epiphany to work on this project again. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined. The documentation for the literate programming project - wheel is [available here](https://xyzzyapps.link/wheel/). ## Support this project My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world. <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> You can find me on [theaudioprogrammer](https://theaudioprogrammer.com/) and algorave discord as @xyzzy. |
|
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
|
|
|
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
|
|
<
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
..
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
# What is bitrhythm about ? In Bitrhythm you get a coding playground to make music with webaudio, canvas and webgl apis. You can share the final track as a URL which enables interactive music with your listener. The url size limit acts as a contraint on creativity. Apart from the core html apis, you can also use the following libraries 1. Tuna 2. Timbral 3. Tone.js 4. Underscore / Rambda 5. cellx (observers) 6. Magenta.js (Machine Learning) 7. P5.js / D3 8. Winamp Visualisations (butterchurn) ```{code-block} html --- force: true ................................................................................ @< import common cog.out(common.external_libraries) @> @@ ``` A few things implemented from scratch in Bitrhythm are, 1. DSL for describing music sequences - similar to the tracker notation 2. A core Music Loop that runs your javascript code, with an edit mode 3. A knob and guard abstraction for programming automation You can use Bitrhythm for making music similar to the music possible with trackers like Buzz / Renoise / OpenMPT. I call this approach Hard Coding music. This is also known as executable music in the Demoscene. You can also use Bitrhythm for Live Coding and Algorithmic composition. ## ADC 2021 I presented Bitrhythm in ADC '21. [Slides](https://xyzzyapps.link/adc21) Video: TBD ## Inspiration for the project I make [web apps](https://xyzzyapps.link) for a living. I started messing with algorithmic composition using pure data around 2011. In many ways Pure Data was my first DAW. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections. For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. [This library](https://www.youtube.com/watch?v=adz1Gv5Lm34) in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker. After my initial work on the project in 2019, the project got sidetracked. After seeing [endless acid banger](https://www.vitling.xyz/toys/acid-banger/) I had an epiphany to work on this project again with programmatic knobs. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined. The documentation for the literate programming project - wheel is [available here](https://xyzzyapps.link/wheel/). ## Support this project My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world. <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> You can find me on [theaudioprogrammer](https://theaudioprogrammer.com/), demoscene and algorave discord as @xyzzy. |
Changes to source/what.md.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
..
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
# What is bitrhythm about ? Currently this is how you can use code with music, 1. VST plugins 2. DAW scripting 3. Embedded code to interact with electronics 4. ML approaches 5. Live coding 6. Use some weird algorithms / number sequences / hardcoded chords / random numbers 7. Web Audio / Audio Programming languages Bitrhythm offers 4-7. In Bitrhythm you get a coding playground to explore and learn webaudio and webgl apis for the purposes of 1. live visual programming 2. live audio programming 3. music sequencing 4. interactive music 5. audio visualisation 6. music learning Apart from the core html apis, you can also use the following libraries 1. Tuna 2. Timbral 3. Tone.js 4. Underscore / Rambda 5. cellx 6. Magenta.js (Machine Learning) 7. P5.js / D3 8. Winamp Visualisations (butterchurn) ```{code-block} html --- force: true ................................................................................ <script src="https://cdn.jsdelivr.net/npm/webmidi@2.0.0"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="/nexus-js/dist/NexusUI.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/cellx/1.10.19/cellx.umd.min.js" integrity="sha512-ojEcAP3e6N+n5MDKPW6CexXzuLDahDPkNZmzyRV4t2zqh9nwljJNuV8JGa+xjpnAaGB/FhsAU7P6IHEP0dtJQA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"></script> ``` ## About Author I make [web apps](https://xyzzyapps.link) apps for a living. I started messing with algorithmic composition using pure data around 2011. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections. For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. [This library](https://www.youtube.com/watch?v=adz1Gv5Lm34) in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker. After my initial work on the project in 2019, the project got sidetracked. After seeing [endless acid banger](https://www.vitling.xyz/toys/acid-banger/) I had an epiphany to work on this project again. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined. The documentation for the literate programming project - wheel is [available here](https://xyzzyapps.link/wheel/). ## Support this project My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world. <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> You can find me on [theaudioprogrammer](https://theaudioprogrammer.com/) and algorave discord as @xyzzy. |
|
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
<
|
|
|
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
|
|
<
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
..
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
# What is bitrhythm about ? In Bitrhythm you get a coding playground to make music with webaudio, canvas and webgl apis. You can share the final track as a URL which enables interactive music with your listener. The url size limit acts as a contraint on creativity. Apart from the core html apis, you can also use the following libraries 1. Tuna 2. Timbral 3. Tone.js 4. Underscore / Rambda 5. cellx (observers) 6. Magenta.js (Machine Learning) 7. P5.js / D3 8. Winamp Visualisations (butterchurn) ```{code-block} html --- force: true ................................................................................ <script src="https://cdn.jsdelivr.net/npm/webmidi@2.0.0"></script> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <script src="/nexus-js/dist/NexusUI.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/cellx/1.10.19/cellx.umd.min.js" integrity="sha512-ojEcAP3e6N+n5MDKPW6CexXzuLDahDPkNZmzyRV4t2zqh9nwljJNuV8JGa+xjpnAaGB/FhsAU7P6IHEP0dtJQA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.4.6/mousetrap.min.js"></script> ``` A few things implemented from scratch in Bitrhythm are, 1. DSL for describing music sequences - similar to the tracker notation 2. A core Music Loop that runs your javascript code, with an edit mode 3. A knob and guard abstraction for programming automation You can use Bitrhythm for making music similar to the music possible with trackers like Buzz / Renoise / OpenMPT. I call this approach Hard Coding music. This is also known as executable music in the Demoscene. You can also use Bitrhythm for Live Coding and Algorithmic composition. ## ADC 2021 I presented Bitrhythm in ADC '21. [Slides](https://xyzzyapps.link/adc21) Video: TBD ## Inspiration for the project I make [web apps](https://xyzzyapps.link) for a living. I started messing with algorithmic composition using pure data around 2011. In many ways Pure Data was my first DAW. Although nothing much came out of it musically, it transformed the way I view programming. The unix pipes concept is identical to the data flow model in pure data; albeit with more connections. For my music I moved onto Electribe, Renoise, Reaper and live looping with my guitar. I started exploring sonic pi in 2019 but TBH none of the live coding tools were doing what I wanted - basically tweaking /knob-twisting in techno so I started my work on this project. [This library](https://www.youtube.com/watch?v=adz1Gv5Lm34) in sonic pi comes close to what I am trying todo with this project. In bitrhythm time is divided into ticks like renoise tracker. After my initial work on the project in 2019, the project got sidetracked. After seeing [endless acid banger](https://www.vitling.xyz/toys/acid-banger/) I had an epiphany to work on this project again with programmatic knobs. I was able to compose an endless and interactive dubtechno demo track. In March 2021, I also picked up on literate programming so this document will have both code and documentation intertwined. The documentation for the literate programming project - wheel is [available here](https://xyzzyapps.link/wheel/). ## Support this project My goal is to make bitrhythm easy for both professionals and music learners. Support my work to get regular updates. Supporters will also get free accounts when I add pro features! Also get notified on latest developments and tutorials in the web audio world. <p><script src="https://gumroad.com/js/gumroad.js"></script><a class="gumroad-button" href="https://gumroad.com/l/iEVpN" target="_blank" rel="noopener"><span class="gumroad-button-logo"></span>Support Bitrhythm</a></p> You can find me on [theaudioprogrammer](https://theaudioprogrammer.com/), demoscene and algorave discord as @xyzzy. |
Changes to templates/index.html.
171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 |
</script>
</head>
<body>
<div class="containera-full">
<hstack class="mb-2">
<h5 class="ml-4"><a href="/docs/index.html" target="_blank">Docs + Demo</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAJwFAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9NTfIT-_uEg-npGX0y9CmzyyVpwgaOUrKNlF-pzVXf3YnQ2gSfpzY3zlYLujavQRq73hSEM-RaGxTxuud9nauG_VdXCmE_lvZ88XvUHOIGjOkCUKV-1ot3i9fx5NP-UsUmVpnjUDnq_9eUJfonx5B_oG4c3GvLitNREl_O9emU8CST0v5RVqHSudqZqsrortpDjdMlekhQ2y7ZlNcUDjGoTrH4vFMrLVI60wINoufS0iO6ourxizS1Ifv_iirkdP0U0Zp21rHHKXlwhWG0hmTCxYo8ZIf0Cmbiu22GiFFmRfIcuWbcq-_SWdyMJ0sWIslhKpGFEapN604eNblpy5im2PsItjWScu-cS0JI3zeHb8JMNzWflq0-XWHG5WLsmPqCbn3GgfR6BiAx1ApmTui84WXgX6SuJPkXRqHEOKpBZ4dKEPr5P_-DDpwz0L7i8X_FHE-LBMactDBoKgIbIoyVnRe6DJ9s5AZLJjUrWGGVCLcp5bEKOnH_3HfZuDq9UlOvZRVkz3BwpUeajLeUJcAYxDmU2JbNUaipMJN7LF9YAX2LaT44LACw2A7Is-pQ_EGznjhEo7SS7JusQPN6G43g4OUZSUY5WNlPUCWfXSeWNU0Xx_-b4r6t4HHQS2P2stIQOS96JqLzXrx-Q62Y8RSRIvieE76j_-dw4icTDiATfx8doLkSzXgOzNTcZYume2cHLEG-0TbgR1M6WCPiH4pvHIRfcTxEDZK5b7iqIhY0MNW8Kkyn7KFVqQf_5d_msiv57DWIHg6Qi6cmBdOF0Li_CY8kFBV4BWLsOlanN6_hehIREVU8WgWbM9rdrKcqzhHD8Fp5qTmbyiVnjD83BDhKY5zwF8xFM1p7ZmEjlIF1ag62BDRt5j_MZ9q5COsX9gpV6DfA0FaDwyOmkMsOFiGeUNIr8B_ENYG-EpYbhUHZukv-QttcjFwRypF1eSN3DMrGUm1eB62PW3s--XcugwT5GJQRa66WZF4DZzPPTKEZhtNL28KgBcHm3DeuSfN_HRsgBW1o2YDpM1QP-K0aedKB_umlWhdBze7Gs72-vDfjB6LGI__tncLNS3GaqYaltFnzc64EOV-mz1xvlyAuFSj-T8r8e5ebJky7o6PZXPTvvCLeTL056Tpp-Gh-WgxmyMISIhkb5kKPj235H7OY-JAoT28VVrA01WpXoArOJaE2ijBt2oLOYXwWiO1hUI3NtTO2vI__sllxHNHS6EiHXPyLj8_PGF47RUq7oc-9ibiF9FUuoonMLE0PwyGOUJ6LU9SDb4FLPwk0gJBP4GiWLftvfErrXDNck9O6_JZvpJ_9O5qmNDUge5yDYbO__vJejx0bomU7eG2kuvPAmGtiWrYo8B_3JoEAOMgVa9SxE4kZ-ijdh-glIKredlMCUG5eYJc-6H_94pteyO-ocB8rrlfSGr6M2r9xlbeMecCvJTRjmwMbB12DWGbDq5Sxn8tgX98O9lT-51_oajqKVMmox3f7kXhsJPxyIMsUaVVFRmpPJvMt5nt9-i1Vgmux4a3t7a1oVPdN35POOjun63NkyODKhTUHmjdC7h9tv6ZI8WPf2Gh9__k6qf5xp3u3OjzkISj7ainHooji_3Cnjm3T30e6pm3MhliJg1ezFi8NetUwwYZz6UNCMOTUaWAqJ5BmF2hAh5Sdsog93orRvrOuPTNhRA1Wlyjrsy8zVW3WlO4chcKVYA0OsH1Zwjo7koXbfX7ERrPnAbZsWfkPePwI4to-KuPF1v0U4jwFelzwn3n4C1E2BkqPfNcvnVlFDmPHlyOCZHrfsrG9GUPsCrZdrX2EHiWH_bRkXVJwkHTLir8d_cjI0DIrVYji4XBIDX9Pmt-0ylr0FeHLXVHNb4Q7V--3d4-mJ2zXsZDR97M_ikaQVHZBWcKnyWmx_aPoWKnFYkk_6PbR246YU3fViA9PdZKTYrN2B3KmcrliH2T2YRcRdWQGxXlXZh3Bsd5PtOC1EuV7-DHlkI67D6V-AFScJfdj64Pv1wKwGQZ7lEZtrmv_VVRmkWYWFtbBj5HHnth1sKhBjVgGIVH74y9b0hHjpo5kw-1_3jNZ1ooxp-y8FTHblmSkSoQe8bey9XQ7BxGbUPsG0X5LfT8FpZH36A6Vz6nedFEvuoQCyV55qcnDD5IKsJeyKZz1ugrYGoZIfJMr1XTiulWUiaxeat7Q6Xq1YXOjvWV7ki_w4m__-wVP5g">Tutorial</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAInBwAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9OTB7Y34cZmeLb5MKZic7bXMO7vWrjHyfc2FvIP0v1Gp--NY5tUsY7sQ71Zzph5WmKUZ2oNtnxz8-HaVpK1SGQzEOq3-lWkeJ76a2J8Ng2OEZxOMNAk6VTnu8fRRTToMlowDe3wjs8DorsxdnW49ThFhGbOek4QAwzPneapDmjuDKRqiqN3btgnfZDzokeOTh6CzwAI2rBbL07YUBEFaMziOJ_2X59eW5g03eCnL7GlOCk2u6_22WnYgZPbc3RuJLf8JLAhbDrXvZHyYekrPuGo_R6V2BCPE14rZFFwJQWEqy_KDtH_YPMhj1TPS62qcPr6qAWrI9nsndpRrczwBFChHSPKiZXjCZJZKH1Kh19A4-vpXwbr1BCiNdOTQ89KKv0OXpIFUMwx5Qd5jsrb2c-hywM688F9TJtPD1rEewoJTzhpRrD0wuMN5kqGTvR2iDS2BFmWQl0GGgvUAT6D640GnQYMCeTfwpSTG7Wnq_PboBCyG_2-kdbDDHL4zgalHx4cqxZhEyUZT6bcp-kPiYnAeWzCn7Sj085jX-Cc40akEEZgjYSrwUisGwSOiePi8t-eQ5P-akBrtCgHdmnQ7rfsErnufae_Ydu2dlElNjDgk2c9CJus8ihzwpGF6FEIRuZqplgDOAgnUy9JPurT8H4dKaXV3DqhLxOhd2EGuELO7kgh67Zi_uvaOkMv1MU3VxwAnC41eJrW_VYum8p2cAvxdBi49jJZ1z9yhZAwQIYfxdSq5ECX-G7FX2drYkAYexBBepkbQzSnPrR3s5xsIRraOIbtQZwIOTfyGvTuHMrO4LlOE4Llpqt549tLwGYs0mrWp6bYksGQHS8fgAIFHyoua3VtyjlgCLaQGi8nJxp0TgsZQ60wPXf7GyXxcZ-bVZSVHGskukkCwhCuggcS_8rA6kA">Demo Song</a></h5>
<h5 class="ml-4" ><a href="https://xyzzyapps.link/samples/" target="_blank">Sample Browser</a></h5>
</hstack>
<bitrhythm song="{{data}}"></bitrhythm>
</div>
<script>
riot.compile(function() {
|
| | | | |
171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 |
</script>
</head>
<body>
<div class="containera-full">
<hstack class="mb-2">
<h5 class="ml-4"><a href="/docs/index.html" target="_blank">docs</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAJwFAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9NTfIT-_uEg-npGX0y9CmzyyVpwgaOUrKNlF-pzVXf3YnQ2gSfpzY3zlYLujavQRq73hSEM-RaGxTxuud9nauG_VdXCmE_lvZ88XvUHOIGjOkCUKV-1ot3i9fx5NP-UsUmVpnjUDnq_9eUJfonx5B_oG4c3GvLitNREl_O9emU8CST0v5RVqHSudqZqsrortpDjdMlekhQ2y7ZlNcUDjGoTrH4vFMrLVI60wINoufS0iO6ourxizS1Ifv_iirkdP0U0Zp21rHHKXlwhWG0hmTCxYo8ZIf0Cmbiu22GiFFmRfIcuWbcq-_SWdyMJ0sWIslhKpGFEapN604eNblpy5im2PsItjWScu-cS0JI3zeHb8JMNzWflq0-XWHG5WLsmPqCbn3GgfR6BiAx1ApmTui84WXgX6SuJPkXRqHEOKpBZ4dKEPr5P_-DDpwz0L7i8X_FHE-LBMactDBoKgIbIoyVnRe6DJ9s5AZLJjUrWGGVCLcp5bEKOnH_3HfZuDq9UlOvZRVkz3BwpUeajLeUJcAYxDmU2JbNUaipMJN7LF9YAX2LaT44LACw2A7Is-pQ_EGznjhEo7SS7JusQPN6G43g4OUZSUY5WNlPUCWfXSeWNU0Xx_-b4r6t4HHQS2P2stIQOS96JqLzXrx-Q62Y8RSRIvieE76j_-dw4icTDiATfx8doLkSzXgOzNTcZYume2cHLEG-0TbgR1M6WCPiH4pvHIRfcTxEDZK5b7iqIhY0MNW8Kkyn7KFVqQf_5d_msiv57DWIHg6Qi6cmBdOF0Li_CY8kFBV4BWLsOlanN6_hehIREVU8WgWbM9rdrKcqzhHD8Fp5qTmbyiVnjD83BDhKY5zwF8xFM1p7ZmEjlIF1ag62BDRt5j_MZ9q5COsX9gpV6DfA0FaDwyOmkMsOFiGeUNIr8B_ENYG-EpYbhUHZukv-QttcjFwRypF1eSN3DMrGUm1eB62PW3s--XcugwT5GJQRa66WZF4DZzPPTKEZhtNL28KgBcHm3DeuSfN_HRsgBW1o2YDpM1QP-K0aedKB_umlWhdBze7Gs72-vDfjB6LGI__tncLNS3GaqYaltFnzc64EOV-mz1xvlyAuFSj-T8r8e5ebJky7o6PZXPTvvCLeTL056Tpp-Gh-WgxmyMISIhkb5kKPj235H7OY-JAoT28VVrA01WpXoArOJaE2ijBt2oLOYXwWiO1hUI3NtTO2vI__sllxHNHS6EiHXPyLj8_PGF47RUq7oc-9ibiF9FUuoonMLE0PwyGOUJ6LU9SDb4FLPwk0gJBP4GiWLftvfErrXDNck9O6_JZvpJ_9O5qmNDUge5yDYbO__vJejx0bomU7eG2kuvPAmGtiWrYo8B_3JoEAOMgVa9SxE4kZ-ijdh-glIKredlMCUG5eYJc-6H_94pteyO-ocB8rrlfSGr6M2r9xlbeMecCvJTRjmwMbB12DWGbDq5Sxn8tgX98O9lT-51_oajqKVMmox3f7kXhsJPxyIMsUaVVFRmpPJvMt5nt9-i1Vgmux4a3t7a1oVPdN35POOjun63NkyODKhTUHmjdC7h9tv6ZI8WPf2Gh9__k6qf5xp3u3OjzkISj7ainHooji_3Cnjm3T30e6pm3MhliJg1ezFi8NetUwwYZz6UNCMOTUaWAqJ5BmF2hAh5Sdsog93orRvrOuPTNhRA1Wlyjrsy8zVW3WlO4chcKVYA0OsH1Zwjo7koXbfX7ERrPnAbZsWfkPePwI4to-KuPF1v0U4jwFelzwn3n4C1E2BkqPfNcvnVlFDmPHlyOCZHrfsrG9GUPsCrZdrX2EHiWH_bRkXVJwkHTLir8d_cjI0DIrVYji4XBIDX9Pmt-0ylr0FeHLXVHNb4Q7V--3d4-mJ2zXsZDR97M_ikaQVHZBWcKnyWmx_aPoWKnFYkk_6PbR246YU3fViA9PdZKTYrN2B3KmcrliH2T2YRcRdWQGxXlXZh3Bsd5PtOC1EuV7-DHlkI67D6V-AFScJfdj64Pv1wKwGQZ7lEZtrmv_VVRmkWYWFtbBj5HHnth1sKhBjVgGIVH74y9b0hHjpo5kw-1_3jNZ1ooxp-y8FTHblmSkSoQe8bey9XQ7BxGbUPsG0X5LfT8FpZH36A6Vz6nedFEvuoQCyV55qcnDD5IKsJeyKZz1ugrYGoZIfJMr1XTiulWUiaxeat7Q6Xq1YXOjvWV7ki_w4m__-wVP5g">techno</a></h5>
<h5 class="ml-4"><a href="/song/XQAAAAIbCAAAAAAAAABDKUqGU5vI8Eygv8VLc6H1NFIzdYQe5mT-79BTKosH6Xje2IYnNRgEOpeuhg9OTB7Y34cZmeLb5MKZic7bXMO7vWrjHyfc2FvIP0v1Gp--NY5tUsY7sQ71Zzph5WmKUZ2oNtnxz8-HaVpK1SGQzEOq3-lWkeJ76a2J8Ng2OEZxOMNAk6VTnu8fRRTToMlowDe3wjs8DorsxdnW49ThFhGbOek4QAwzPneapDmjuDKRqiqN3btgnfZDzokeOTh6CzwAI2rBbL07YUBEFaMziOJ_2X59fYBPM3eCnL7GlOCk2u6_22WnYgZPbc3RuJLf8JLAhbDrXvZHyYekrPuGo_R6V2BCPE14rZFFwJQWEqy_KDtH_YPMhj1TPS62qcPr6qAWrI9nsndpRrczwBFChHSPKiZXjCZJZKH1Kh19A4-vpXwbr1BCiNdOTQ89KKv0OXpIFUMwx5Qd5jsrb2c-hywM688ClZ86A5o4KzrE2xjG4VbcexmPdOXS-K6PRU4c6dJOUClOLNZpbmZvL8Bo4ep67wL0bFEOMqhN30pLGmZlnfd5mgH8J9dPrGsEglKLGskQ_g2vEeR9CzOstzctjCKtL1O8oNkSuCnXSGE0uY5rxGmBu7AW99tRx0i8hNzB4l1S1mxnzkLefi9VM6YYZraX7T2kGnRgD5HOg0WH2LeUsVuWpnp189Ph_Os95_XUVBc67TwU8IWbzat1decCt0jKKP13L7a0OCO18Fq2DVr9veHq2mRepiObWGsYcqjXkUNjaxoItg_pWdK6gyveVXjfs3PaJ477UbpiZBWxoc-Ebn8FZu6bZZ4gOZE-MoJHUDiQZgo3-lirXTvpcpsgsaIUESDAcGUNE4aIK6wIFGnEaEFYo4veQqTLeic4NhPtUpTdfRqdNTKOaVSUE_KGXKXaZl0Eni1DBmEGykml4uxHsWBEE44Ku34YIb6KZUcCu2DuXDiXcbabsWkA-czXWBtRnzWJ6ib4scny1o6CsVnugUjE9wv84bz2">chiptune</a></h5>
<h5 class="ml-4" ><a href="https://xyzzyapps.link/samples/" target="_blank">sample browser</a></h5>
</hstack>
<bitrhythm song="{{data}}"></bitrhythm>
</div>
<script>
riot.compile(function() {
|