A Pen by Tero Parviainen on CodePen.
| {%- comment -%} | |
| This snippet structures the micro-data using JSON-LD specification. Please note that for Product especially, | |
| the schema often changes. We try to output as much info as possible, but Google may add new requirements over time, | |
| or change the format of some info | |
| {%- endcomment -%} | |
| {%- if request.page_type == 'product' -%} | |
| {%- assign days_product_price_valid_until = 10 | times: 86400 -%} | |
| {%- capture main_entity_microdata -%} |
| <div class="container"> | |
| <div class="machine-bg"> | |
| <div class="player"></div> | |
| <div class="controls top-controls"> | |
| <div> | |
| <div id="temperature" class="mdc-slider" tabindex="0" role="slider" aria-valuemin="0.2" aria-valuemax="2" aria-valuenow="1.1" | |
| aria-label="Select temperature"> | |
| <div class="mdc-slider__track-container"> | |
| <div class="mdc-slider__track"></div> | |
| </div> |
| <canvas></canvas> | |
| <button id="start" disabled>Loading…</button> |
| <html> | |
| <head> | |
| <title>Magenta - multitrack chords</title> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> | |
| <link id="favicon" rel="icon" href="https://magenta.tensorflow.org/favicon.ico" type="image/x-icon"> | |
| <link href="https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,700" rel="stylesheet"> | |
| <script src="https://cdn.jsdelivr.net/npm/@magenta/[email protected]"></script> |
| <div id="wave"></div> | |
| <div id="hint">Click on the waveform</div> |
This only performs well in Google Chrome, Firefox, and Safari.
“In C” is a musical piece intended to be played by a variable amount of performers. The piece is divided into 53 segments that are to be played, “consecutively with each performer having the freedom to determine how many times he or she will repeat each pattern before moving on to the next.”
Performers are expected to stay within two or three patterns of each other. Once each performer is on the last segment, each performer repeats the last pattern until everyone arrives there, and then they each drop out one by one. This performance is truncated from the preferred 45-90 seconds per segment to 7.5-15 seconds per segment if played at 120 bpm.
On the right, you will see each performer and their current segment as well as a tempo control. In the visualization, each color corresponds to the note being played with red being “C”. The x axis and width of the note are r