34:["$","title",null,{"children":"Day 11: Senses: Sound | Xavier Olive | Observable"}] 3c:Tb77,## About this page Each scale is reduced here to a set of pitches, all played from the same tonic, middle C, so that they can be compared by ear. A real performance adds ornaments, slides, rhythm and instruments that no scale captures, and many traditions have no fixed tuning: the values are common theoretical descriptions or published approximations, rounded to the cent, and the places are where each tradition is strongly rooted, not borders. The sounds are synthesised in the browser: a few harmonics shaped to suggest a piano, a plucked lute, a flute, a wooden xylophone or bronze gamelan keys, a drone for maqams and ragas, and melodies improvised by a random walk on the notes of the scale that always comes home to the tonic. The melodies also follow the rhythm of each tradition, with a light percussion: a Viennese waltz, the twelve-beat compás of flamenco with its handclaps, the *dum* and *tek* of the darbuka in the Arabic maqsum, the sixteen beats of tintal and the ten of jhaptal on a tabla tuned to the tonic, the gongs that close each 16-beat cycle of the gamelan, the bell pattern of West Africa, a blues shuffle, an Andean huayno, Ethiopian 6/8, the ching and chap cymbals of Thai music. Persian āvāz and the koto's in scale are left in free rhythm, with their silences. These are sketches of each style, a few typical figures repeated, not transcriptions of real pieces. Their tempos were matched to real recordings: a minute of each was analysed with a beat tracker (librosa), and the result read against what is usual in each style, since such tools easily report half or double the beat. Under each scale, a strip of piano keys gives every semitone the same width: the keys the scale uses are lit, and notes that fall between keys are drawn where they really are, with their distance to the nearest key in cents. The 🎧 button opens a recording of the tradition on YouTube; where it illustrates the rhythm rather than the exact mode, its caption says so. *Generate* composes a short piece for each tradition, built from gestures rather than single notes: a call and its answer, a run slurred on a single breath or stroke, a bend, a tremolo, a held note and its silence, two parts that interlock. Each follows the instrument and the form of its tradition: a waltz and a lament for Vienna, a chorale in pure intervals for Venice, a 12-bar blues, quena phrases with their breaths, the soleá compás, taqsim and āvāz in free rhythm over a drone, a gat in tintal and phrases in jhaptal that land on the sam, gamelan skeletons with the parts that anticipate them, a ranat weaving around a Thai core melody, guzheng and koto phrases with their slides and pressed notes, a min'yō call and its chorus, a swung eisā, a washint over a krar ostinato, interlocking amadinda parts and a balafon ostinato. They are studies written for this page, not transcriptions, and each click varies a few of their phrases.3d:T141e2,// ── Scales, sound engine, rhythms, clock, players and map ──────────────────── // Sound is synthesised in the browser with the Web Audio API: additive partials for each instrument family, // a drone for maqams and ragas, synthesised percussion, and short pieces composed in the rhythm and gestures // of each tradition. sc = { // ── The scales ─────────────────────────────────────────────────────── // Steps in cents above the tonic (100 cents = an equal-tempered semitone, 1200 = an octave). // Where a tradition has no fixed tuning, the values are a common theoretical or measured approximation (see note). const SCALES = [ {id: "major", name: "Major scale", local: "do ré mi fa sol la si", place: "Vienna", lon: 16.37, lat: 48.21, family: "Classical", cents: [0, 200, 400, 500, 700, 900, 1100], timbre: "piano", note: "The scale of most Western music since the 17th century, in equal temperament: the octave split into 12 identical semitones."}, {id: "minor", name: "Harmonic minor scale", local: "la si do ré mi fa sol♯", place: "Vienna", lon: 16.37, lat: 48.21, family: "Classical", cents: [0, 200, 300, 500, 700, 800, 1100], timbre: "piano", note: "The minor scale of classical harmony: a lowered third and sixth, and a raised seventh that leads back to the tonic."}, {id: "just", name: "Major scale in just intonation", local: "Zarlino, 1558", place: "Venice", lon: 12.34, lat: 45.44, family: "Classical", cents: [0, 204, 386, 498, 702, 884, 1088], timbre: "organ", note: "The same scale tuned with simple frequency ratios (9/8, 5/4, 4/3, 3/2…), as Renaissance theorists described it. The thirds are 14 cents lower than on a modern piano."}, {id: "blues", name: "Blues scale", local: "blue notes", place: "Clarksdale", lon: -90.57, lat: 34.2, family: "Americas", cents: [0, 300, 500, 600, 700, 1000], timbre: "pluck", note: "A minor pentatonic with an added flattened fifth. On the piano these are fixed notes; singers and guitarists bend them in between."}, {id: "andes", name: "Andean pentatonic", local: "música andina", place: "Cusco", lon: -71.97, lat: -13.53, family: "Pentatonic", cents: [0, 300, 500, 700, 1000], timbre: "flute", note: "Five notes without semitones, in its minor form, as heard on Andean quena flutes and panpipes."}, {id: "flamenco", name: "Phrygian dominant (Andalusian mode)", local: "modo flamenco", place: "Seville", lon: -5.98, lat: 37.39, family: "Mediterranean", cents: [0, 100, 400, 500, 700, 800, 1000], timbre: "guitar", note: "The step of a semitone then of three semitones gives flamenco its colour. On paper, the same notes as maqam Hijaz and the Jewish freygish."}, {id: "hijaz", name: "Maqam Hijaz", local: "مقام حجاز", place: "Cairo", lon: 31.24, lat: 30.04, family: "Maqam", drone: true, cents: [0, 100, 400, 500, 700, 800, 1000], timbre: "oud", note: "Named after the Hejaz, in Arabia. In the 24-tone notation of Arabic theory, the same notes as flamenco's mode; musicians tune the second a little higher and the third a little lower."}, {id: "rast", name: "Maqam Rast", local: "مقام راست", place: "Cairo", lon: 31.24, lat: 30.04, family: "Maqam", drone: true, cents: [0, 200, 350, 500, 700, 900, 1050], timbre: "oud", note: "The mother of the Arabic maqams. Its third and seventh fall halfway between major and minor: the famous quarter tones, here at 350 and 1050 cents."}, {id: "bayati", name: "Maqam Bayati", local: "مقام بياتي", place: "Baghdad", lon: 44.36, lat: 33.31, family: "Maqam", drone: true, cents: [0, 150, 300, 500, 700, 800, 1000], timbre: "oud", note: "A three-quarter tone then another three-quarter tone: the second note sits halfway between a semitone and a whole tone."}, {id: "shur", name: "Dastgah Shur", local: "دستگاه شور", place: "Tehran", lon: 51.39, lat: 35.69, family: "Maqam", drone: true, cents: [0, 150, 300, 500, 700, 800, 1000], timbre: "santur", note: "The main mode of Persian classical music. In the 24-tone notation introduced by Vaziri it shares Bayati's notes; the two differ in their melodic paths and ornaments."}, {id: "yaman", name: "Raga Yaman", local: "राग यमन", place: "Varanasi", lon: 82.97, lat: 25.32, family: "Raga", drone: true, cents: [0, 204, 386, 590, 702, 884, 1088], timbre: "sitar", note: "An evening raga of North Indian music, with a raised fourth. Theory describes its intervals with simple ratios, as in just intonation; in practice, as in the recording, musicians often play them higher."}, {id: "bhairav", name: "Raga Bhairav", local: "राग भैरव", place: "Varanasi", lon: 82.97, lat: 25.32, family: "Raga", drone: true, cents: [0, 112, 386, 498, 702, 814, 1088], timbre: "sitar", note: "A morning raga: lowered second and sixth, natural third and seventh, two gaps of three semitones."}, {id: "thai", name: "Thai seven-tone equal scale", local: "ระนาด", place: "Bangkok", lon: 100.5, lat: 13.75, family: "Equal steps", cents: [0, 171, 343, 514, 686, 857, 1029], timbre: "mallet", note: "The octave split into seven roughly equal steps of about 171 cents, neither a semitone nor a whole tone, as on the ranat xylophones."}, {id: "slendro", name: "Slendro", local: "laras sléndro", place: "Yogyakarta", lon: 110.37, lat: -7.8, family: "Gamelan", cents: [0, 240, 480, 720, 960], timbre: "gong", note: "Five near-equal steps of about 240 cents. Every gamelan is tuned on its own, so real values wander around these."}, {id: "pelog", name: "Pelog", local: "laras pélog", place: "Yogyakarta", lon: 110.37, lat: -7.8, family: "Gamelan", cents: [0, 120, 260, 540, 670, 785, 950], timbre: "gong", note: "Seven unequal steps, from which pieces use five. Values for one gamelan, rounded: each set has its own tuning."}, {id: "gong", name: "Chinese pentatonic (gong mode)", local: "宫调式", place: "Xi'an", lon: 108.94, lat: 34.34, family: "Pentatonic", cents: [0, 204, 408, 702, 906], timbre: "guzheng", note: "Gong, shang, jue, zhi, yu: five notes obtained by stacking pure fifths (the method of adding and subtracting thirds of a pipe length), hence slightly wider thirds than on a piano."}, {id: "yo", name: "Yo scale", local: "陽旋法", place: "Kyoto", lon: 135.77, lat: 35.01, family: "Pentatonic", cents: [0, 200, 500, 700, 900], timbre: "koto", note: "Pentatonic without semitones, used in Japanese folk song and gagaku."}, {id: "in", name: "In scale (miyako-bushi)", local: "都節音階", place: "Kyoto", lon: 135.77, lat: 35.01, family: "Pentatonic", cents: [0, 100, 500, 700, 800], timbre: "koto", note: "Pentatonic with two semitones, the sound of the koto and of Edo-period urban music."}, {id: "ryukyu", name: "Ryukyu scale", local: "琉球音階", place: "Okinawa", lon: 127.68, lat: 26.21, family: "Pentatonic", cents: [0, 400, 500, 700, 1100], timbre: "sanshin", note: "The scale of Okinawan song and the sanshin lute. The same five notes as the Ethiopian Bati, half a world away."}, {id: "bati", name: "Bati qenet", local: "ባቲ", place: "Addis Ababa", lon: 38.75, lat: 9.03, family: "Pentatonic", cents: [0, 400, 500, 700, 1100], timbre: "krar", note: "One of the four main modes (qenet) of Ethiopian music, played on the krar lyre. Identical, note for note, to the Okinawan Ryukyu scale."}, {id: "amadinda", name: "Amadinda pentatonic", local: "Buganda", place: "Kampala", lon: 32.58, lat: 0.35, family: "Equal steps", cents: [0, 240, 480, 720, 960], timbre: "mallet", note: "The xylophones of the Buganda court split the octave into five near-equal steps, like Javanese slendro on another continent."}, {id: "balafon", name: "Balafon heptatonic", local: "Mande", place: "Bamako", lon: -8.0, lat: 12.64, family: "Equal steps", cents: [0, 171, 343, 514, 686, 857, 1029], timbre: "mallet", note: "Many Mande balafons are tuned close to seven equal steps, like Thai instruments. Tunings vary from one maker to another."}, ]; const FAMILIES = ["Classical", "Pentatonic", "Maqam", "Raga", "Gamelan", "Equal steps", "Mediterranean", "Americas"]; // ── Sound ──────────────────────────────────────────────────────────── // One AudioContext, created on the first click (browsers only allow sound after a user gesture). const TONIC = 261.63; // C4: every scale starts on the same note, to compare them by ear let audio = null, master = null, voices = new Set(), timers = []; const openBoxes = new Set(); // open recordings: one sound at a time function ctx() { if (!audio) { audio = new (window.AudioContext || window.webkitAudioContext)(); master = audio.createGain(); master.gain.value = 0.5; const comp = audio.createDynamicsCompressor(); master.connect(comp); comp.connect(audio.destination); } if (audio.state === "suspended") audio.resume(); return audio; } const freq = (cents, octave = 0) => TONIC * 2 ** (octave + cents / 1200); // Timbres: additive partials (ratio, gain) with an envelope; enough to tell a piano from a gong const TIMBRES = { piano: {partials: [[1, 1], [2, 0.45], [3, 0.25], [4, 0.12], [5, 0.06]], attack: 0.005, decay: 1.6}, organ: {partials: [[1, 1], [2, 0.5], [3, 0.3], [4, 0.2]], attack: 0.04, decay: 0, sustain: true}, pluck: {partials: [[1, 1], [2, 0.6], [3, 0.4], [4, 0.25], [5, 0.15], [6, 0.1]], attack: 0.003, decay: 0.9}, oud: {partials: [[1, 1], [2, 0.7], [3, 0.35], [4, 0.3], [5, 0.12]], attack: 0.004, decay: 1.1}, santur: {partials: [[1, 1], [2, 0.5], [3, 0.35], [4.02, 0.2], [6, 0.1]], attack: 0.002, decay: 1.8}, sitar: {partials: [[1, 1], [2, 0.8], [3, 0.6], [4, 0.5], [5, 0.4], [6, 0.3], [7, 0.2]], attack: 0.004, decay: 1.4}, guzheng: {partials: [[1, 1], [2, 0.65], [3, 0.5], [4, 0.32], [5.02, 0.22], [6.03, 0.14], [7.05, 0.08]], attack: 0.002, decay: 2.4, bend: 10, vibrato: [6, 16, 0.35]}, // fingerpicks on metal strings, a long ring, left-hand vibrato on held notes koto: {partials: [[1, 1], [2, 0.5], [3, 0.4], [4, 0.2], [5, 0.1]], attack: 0.003, decay: 1.2}, krar: {partials: [[1, 1], [2, 0.6], [3, 0.5], [4, 0.3], [5, 0.2]], attack: 0.003, decay: 1.0}, flute: {partials: [[1, 1], [2, 0.25], [3, 0.12], [4, 0.05]], attack: 0.09, decay: 0, sustain: true, breath: 0.05, vibrato: [5.5, 14, 0.25]}, // quena: breath noise, delayed vibrato sanshin: {partials: [[1, 1], [2, 0.9], [3, 0.7], [4, 0.55], [5, 0.45], [6, 0.35], [8, 0.2]], attack: 0.002, decay: 0.55, bend: 30}, // snake-skin lute: bright, short, a pitch drop at the pluck guitar: {partials: [[1, 1], [2, 0.7], [3, 0.5], [4, 0.35], [5, 0.25], [6, 0.15]], attack: 0.002, decay: 1.0, bend: 8}, mallet: {partials: [[1, 1], [3.93, 0.35], [9.5, 0.1]], attack: 0.002, decay: 0.7}, // wooden bar: inharmonic overtones gong: {partials: [[1, 1], [2.76, 0.4], [5.4, 0.2], [8.93, 0.08]], attack: 0.003, decay: 2.6}, // bronze keys }; function note(f, t, dur, timbre = "piano", gain = 0.22) { const a = ctx(), T = TIMBRES[timbre] ?? TIMBRES.piano, out = a.createGain(); out.connect(master); const end = T.sustain ? t + dur : t + Math.max(dur, T.decay * 1.5); out.gain.setValueAtTime(0, t); out.gain.linearRampToValueAtTime(gain, t + T.attack); if (T.sustain) { out.gain.setValueAtTime(gain, t + dur - 0.06); out.gain.linearRampToValueAtTime(0, t + dur); } else out.gain.exponentialRampToValueAtTime(0.0001, end); const oscs = []; for (const [ratio, g] of T.partials) { const o = a.createOscillator(), og = a.createGain(); o.frequency.value = f * ratio; og.gain.value = g / T.partials.length; if (T.bend) { o.detune.setValueAtTime(T.bend, t); o.detune.linearRampToValueAtTime(0, t + 0.06); } // plucked strings start a little sharp o.connect(og); og.connect(out); o.start(t); o.stop(end + 0.05); voices.add(o); o.onended = () => voices.delete(o); oscs.push(o); } if (T.vibrato) { // [rate in Hz, depth in cents, delay in seconds] const [rate, depth, delay] = T.vibrato, lfo = a.createOscillator(), lg = a.createGain(); lfo.frequency.value = rate; lg.gain.setValueAtTime(0, t); lg.gain.setValueAtTime(0, t + delay); lg.gain.linearRampToValueAtTime(depth, t + delay + 0.25); lfo.connect(lg); oscs.forEach((o) => lg.connect(o.detune)); lfo.start(t); lfo.stop(end + 0.05); voices.add(lfo); lfo.onended = () => voices.delete(lfo); } if (T.breath) { // breath noise around the note const s = noise(a), bq = a.createBiquadFilter(), ng = a.createGain(); s.loop = true; bq.type = "bandpass"; bq.frequency.value = Math.min(8000, f * 3); bq.Q.value = 1.2; ng.gain.value = T.breath; s.connect(bq); bq.connect(ng); ng.connect(out); s.start(t); s.stop(end + 0.05); voices.add(s); s.onended = () => voices.delete(s); } } // A drone on the tonic and the fifth (or fourth), as the tanpura or the ney players' ison function drone(cents, t, dur) { const fifth = cents.find((c) => Math.abs(c - 700) < 20) ?? cents.find((c) => Math.abs(c - 500) < 20) ?? 0; for (const [c, oct, g] of [[0, -1, 0.07], [fifth, -1, 0.045], [0, -2, 0.05]]) { const a = ctx(), o = a.createOscillator(), og = a.createGain(), lp = a.createBiquadFilter(); o.type = "sawtooth"; o.frequency.value = freq(c, oct); lp.type = "lowpass"; lp.frequency.value = 900; og.gain.setValueAtTime(0, t); og.gain.linearRampToValueAtTime(g, t + 0.8); og.gain.setValueAtTime(g, t + dur - 1); og.gain.linearRampToValueAtTime(0, t + dur); o.connect(lp); lp.connect(og); og.connect(master); o.start(t); o.stop(t + dur + 0.1); voices.add(o); o.onended = () => voices.delete(o); } } function stop() { for (const o of voices) { try { o.stop(); } catch {} } for (const b of openBoxes) b.replaceChildren(); openBoxes.clear(); voices.clear(); timers.forEach(clearTimeout); timers = []; for (const fn of listeners) fn(null); } // listeners are told which note (index in the scale) sounds, to light it up on the clocks const listeners = new Set(); const onNote = (fn) => (listeners.add(fn), () => listeners.delete(fn)); function schedule(scale, events) { // events: [time from now (s), degree index or null, duration] const a = ctx(), t0 = a.currentTime + 0.08; for (const [t, i, dur, oct = 0, accent = 1] of events) { if (i == null) continue; const n = scale.cents.length; // degree n is the tonic an octave up note(freq(scale.cents[i % n], oct + Math.floor(i / n)), t0 + t, dur, scale.timbre, 0.22 * accent); timers.push(setTimeout(() => listeners.forEach((fn) => fn({id: scale.id, degree: i % n, octave: oct + Math.floor(i / n)})), (t + 0.08) * 1000)); } const total = Math.max(...events.map(([t, , d]) => t + d)); timers.push(setTimeout(() => listeners.forEach((fn) => fn(null)), (total + 0.6) * 1000)); return total; } /** Up the scale to the octave, then down from the octave again */ function playScale(scale) { stop(); const n = scale.cents.length, step = 0.38, events = []; for (let i = 0; i <= n; i++) events.push([i * step, i, step * 1.6]); // down again, starting with the upper C repeated, as usually played, and a held tonic at the end for (let i = n; i >= 0; i--) events.push([(2 * n + 1 - i) * step, i, i === 0 ? 1.2 : step * 1.6]); if (scale.drone) drone(scale.cents, ctx().currentTime + 0.05, (2 * n + 3) * step); schedule(scale, events); } // ── Rhythm ─────────────────────────────────────────────────────────── // Each tradition gets a rhythmic profile: a cycle of `cycle` grid units (`perBeat` units per beat at `bpm`), // melodic cells (durations in units) that fill `cell` units, accents, a percussion pattern [unit, sound, gain], // and for some a bass. These are simplified evocations of each style, not transcriptions. const RHYTHMS = { waltz: {label: "Viennese waltz, 3/4", bpm: 184, perBeat: 2, cycle: 6}, common: {label: "andante, 4/4", bpm: 66, perBeat: 2, cycle: 8}, chorale: {label: "Renaissance chorale, slow 4/4", bpm: 56, perBeat: 1, cycle: 4}, shuffle: {label: "12/8 shuffle", bpm: 104, perBeat: 3, cycle: 12, perc: [[0, "kick", 1], [6, "kick", 0.8], [3, "clap", 0.8], [9, "clap", 0.8], ...[0, 2, 3, 5, 6, 8, 9, 11].map((u) => [u, "hat", 0.35])]}, huayno: {label: "huayno, 2/4", bpm: 100, perBeat: 4, cycle: 8, perc: [[0, "low", 1], [2, "high", 0.6], [3, "high", 0.5], [4, "low", 0.9], [6, "high", 0.6], [7, "high", 0.5]]}, solea: {label: "soleá, 12-beat compás", bpm: 120, perBeat: 2, cycle: 24, // beats 3, 6, 8, 10, 12 perc: Array.from({length: 12}, (_, b) => [2 * b, "clap", [2, 5, 7, 9, 11].includes(b) ? 1 : 0.3])}, maqsum: {label: "iqa' maqsum: dum tek – tek dum – tek –", bpm: 92, perBeat: 2, cycle: 8, perc: [[0, "dum", 1], [1, "tek", 0.7], [3, "tek", 0.7], [4, "dum", 0.9], [6, "tek", 0.7]]}, avaz: {label: "āvāz, free rhythm", free: true}, ma: {label: "free rhythm, with silences (ma)", free: true}, tintal: {label: "tintal, 16 beats", bpm: 152, perBeat: 2, cycle: 32, perc: "dha dhin dhin dha dha dhin dhin dha dha tin tin ta ta dhin dhin dha".split(" ").flatMap((b, k) => tabla(b, 2 * k, k === 0))}, jhaptal: {label: "jhaptal, 10 beats", bpm: 118, perBeat: 2, cycle: 20, perc: "dhi na dhi dhi na ti na dhi dhi na".split(" ").flatMap((b, k) => tabla(b, 2 * k, k === 0))}, thai: {label: "ching–chap cymbals, 2/4", bpm: 148, perBeat: 2, cycle: 8, perc: [[0, "chap", 0.8], [2, "ching", 0.7], [4, "chap", 0.8], [6, "ching", 0.7]]}, gamelan: {label: "gongan of 16 beats, punctuated by gongs", bpm: 132, perBeat: 1, cycle: 16, perc: [...[1, 5, 9, 13].map((u) => [u, "kethuk", 0.6]), ...[3, 7, 11, 15].map((u) => [u, "kenong", 0.8]), ...[5, 9, 13].map((u) => [u, "kempul", 0.6]), [15, "bigGong", 1]]}, gamelanSlow: {label: "gongan of 16 beats, slower", bpm: 58, perBeat: 1, cycle: 16, perc: [...[1, 5, 9, 13].map((u) => [u, "kethuk", 0.6]), ...[3, 7, 11, 15].map((u) => [u, "kenong", 0.8]), ...[5, 9, 13].map((u) => [u, "kempul", 0.6]), [15, "bigGong", 1]]}, chinese: {label: "2/4, with a woodblock", bpm: 60, perBeat: 4, cycle: 8, // a quick glissando into each phrase perc: [[0, "wood", 0.9], [4, "wood", 0.6]]}, minyo: {label: "min'yō, 2/4 with taiko", bpm: 104, perBeat: 2, cycle: 8, perc: [[0, "low", 1], [3, "rim", 0.5], [4, "low", 0.8], [6, "rim", 0.6], [7, "rim", 0.4]]}, eisa: {label: "eisā, 2/4 with taiko and offbeat claps", bpm: 144, perBeat: 2, cycle: 8, swing: 0.2, perc: [[0, "low", 1], [4, "low", 0.9], [2, "rim", 0.6], [6, "rim", 0.6], [1, "clap", 0.45], [3, "clap", 0.45], [5, "clap", 0.45], [7, "clap", 0.45]]}, sixeight: {label: "6/8, with the kebero drum", bpm: 78, perBeat: 3, cycle: 6, perc: [[0, "low", 1], [2, "high", 0.5], [3, "low", 0.7], [5, "high", 0.6]]}, amadinda: {label: "fast interlocking pulse", bpm: 516, perBeat: 1, cycle: 12}, bell: {label: "12/8 over the bell pattern", bpm: 117, perBeat: 3, cycle: 12, perc: [...[0, 2, 4, 5, 7, 9, 11].map((u) => [u, "bell", 0.6]), [0, "low", 0.9], [6, "low", 0.7]]}, }; function tabla(bol, u, sam) { // bass (bayan) on dha/dhin/dhi, treble (dayan) always, tuned to the tonic const bass = /^dh/.test(bol), g = sam ? 1 : 0.75; return [[u, "dayan", g * (bol === "dhin" || bol === "dhi" ? 0.8 : 0.9)], ...(bass ? [[u, "bayan", g]] : [])]; } const RHYTHM_OF = { major: "waltz", minor: "common", just: "chorale", blues: "shuffle", andes: "huayno", flamenco: "solea", hijaz: "maqsum", rast: "maqsum", bayati: "maqsum", shur: "avaz", yaman: "tintal", bhairav: "jhaptal", thai: "thai", slendro: "gamelan", pelog: "gamelanSlow", gong: "chinese", yo: "minyo", in: "ma", ryukyu: "eisa", bati: "sixeight", amadinda: "amadinda", balafon: "bell", }; const rhythmOf = (scale) => RHYTHMS[RHYTHM_OF[scale.id]] ?? RHYTHMS.common; /** The tempo as shown to readers: beats a minute, or free */ const tempoLabel = (R) => (R.free ? R.label : `${R.label}, ${R.bpm} beats a minute`); // Percussion, synthesised: pitched membranes, filtered noise and metal let noiseBuffer = null; function noise(a) { if (!noiseBuffer) { noiseBuffer = a.createBuffer(1, a.sampleRate, a.sampleRate); const d = noiseBuffer.getChannelData(0); for (let i = 0; i < d.length; i++) d[i] = Math.random() * 2 - 1; } const s = a.createBufferSource(); s.buffer = noiseBuffer; return s; } function hit(kind, t, g = 1) { const a = ctx(), out = a.createGain(); out.connect(master); const env = (peak, decay) => { out.gain.setValueAtTime(0.0001, t); out.gain.exponentialRampToValueAtTime(peak * g, t + 0.004); out.gain.exponentialRampToValueAtTime(0.0001, t + decay); return t + decay + 0.05; }; const tone = (f0, f1, decay, type = "sine") => { const o = a.createOscillator(); o.type = type; o.frequency.setValueAtTime(f0, t); o.frequency.exponentialRampToValueAtTime(f1, t + decay * 0.7); o.connect(out); o.start(t); o.stop(t + decay + 0.05); voices.add(o); o.onended = () => voices.delete(o); }; const hiss = (type, f, q, decay) => { const s = noise(a), bq = a.createBiquadFilter(); bq.type = type; bq.frequency.value = f; bq.Q.value = q; s.connect(bq); bq.connect(out); s.start(t); s.stop(t + decay + 0.05); voices.add(s); s.onended = () => voices.delete(s); }; const metal = (fs, decay) => fs.forEach((f) => tone(f, f, decay)); switch (kind) { case "kick": env(0.9, 0.35); tone(120, 45, 0.35); break; case "low": env(0.8, 0.4); tone(150, 70, 0.4); break; // bombo, taiko, kebero (low head) case "high": env(0.35, 0.08); hiss("bandpass", 2200, 1.2, 0.08); tone(420, 380, 0.08); break; case "rim": env(0.3, 0.05); hiss("bandpass", 3200, 2, 0.05); break; case "clap": env(0.45, 0.14); hiss("bandpass", 1300, 0.9, 0.14); break; case "hat": env(0.18, 0.04); hiss("highpass", 7000, 0.7, 0.04); break; case "dum": env(0.9, 0.45); tone(110, 75, 0.45); break; // darbuka, centre case "tek": env(0.4, 0.07); hiss("bandpass", 3000, 1.5, 0.07); tone(900, 850, 0.05); break; // darbuka, rim case "bayan": env(0.7, 0.6); tone(85, 70, 0.6); break; // tabla, bass drum case "dayan": env(0.35, 0.35); metal([TONIC, TONIC * 2, TONIC * 3.01], 0.35); break; // tabla, treble drum tuned to the tonic case "wood": env(0.45, 0.06); tone(1100, 1000, 0.06); break; case "bell": env(0.25, 0.25); metal([1320, 2010], 0.25); break; case "ching": env(0.18, 0.7); metal([2650, 3970, 5310], 0.7); break; // open case "chap": env(0.2, 0.06); metal([2650, 3970], 0.06); hiss("highpass", 5000, 0.7, 0.05); break; // damped case "kethuk": env(0.4, 0.18); tone(TONIC * 0.75, TONIC * 0.74, 0.18); break; case "kenong": env(0.35, 1.6); metal([TONIC, TONIC * 2.01], 1.6); break; case "kempul": env(0.35, 2.0); metal([TONIC / 2, TONIC * 1.002], 2.0); break; case "bigGong": env(0.6, 4.5); metal([TONIC / 4, TONIC / 4 * 1.012, TONIC / 2 * 1.5], 4.5); break; // slow beating } } // ── Gestures ──────────────────────────────────────────────────────── // For every tradition, Generate composes gestures before notes: a call and its answer, a breath, a return to the // sam, a strike and its damping, two interlocking parts. Each gesture places a few notes, with an articulation // (slurred groups on a single attack, bends, breath, short or ringing ends). The phrases, voicings and rules are // composed for this page (they are studies, not transcriptions); the waltz is a small original piece in C major. // Ported from a separate listening laboratory, where these versions were compared by ear with the earlier generator. const STYLES = { // envelope of a gesture's group of notes, by articulation breath: {attack: 0.065, decay: 0.12, sustain: 0.92, release: 0.06}, string: {attack: 0.003, decay: 0.15, sustain: 0.40, release: 0.06}, metal: {attack: 0.002, decay: 0.10, sustain: 0.22, release: 0.035}, strike: {attack: 0.002, decay: 0.035, sustain: 0.05, release: 0.018}, muted: {attack: 0.002, decay: 0.045, sustain: 0.10, release: 0.025}, pluck: {attack: 0.003, decay: 0.085, sustain: 0.24, release: 0.05}, piano: {attack: 0.005, decay: 0.065, sustain: 0.42, release: 0.05}, chord: {attack: 0.005, decay: 0.065, sustain: 0.25, release: 0.045}, organ: {attack: 0.04, decay: 0.1, sustain: 0.9, release: 0.1}, }; const seeded = (seed) => () => { seed |= 0; seed = (seed + 0x6d2b79f5) | 0; let t = Math.imul(seed ^ (seed >>> 15), 1 | seed); t ^= t + Math.imul(t ^ (t >>> 7), 61 | t); return ((t ^ (t >>> 14)) >>> 0) / 4294967296; }; const pitch = (scale, degree, cents = 0) => { const n = scale.cents.length, k = ((degree % n) + n) % n; return TONIC * 2 ** (Math.floor(degree / n) + (scale.cents[k] + cents) / 1200); }; /** Plays one gesture group: a single attack, then glides between its notes (a slur), bends, vibrato, breath */ function line(events, t0) { events.sort((x, y) => x.time - y.time); const a = ctx(), first = events[0], last = events.at(-1), S = STYLES[first.style] ?? STYLES.pluck, T = TIMBRES[first.timbre] ?? TIMBRES.piano; const start = t0 + first.time, end = t0 + Math.max(...events.map((e) => e.time + e.duration)), total = end - start; const release = Math.min(last.release ?? S.release, total * 0.25), decay = Math.min(S.decay, (total - release) * 0.55), attack = Math.min(S.attack, decay * 0.5); const out = a.createGain(); out.connect(master); out.gain.setValueAtTime(0.0001, start); out.gain.exponentialRampToValueAtTime(first.gain, start + attack); out.gain.exponentialRampToValueAtTime(Math.max(0.0001, first.gain * S.sustain), start + decay); for (const e of events.slice(1)) out.gain.linearRampToValueAtTime(Math.max(0.0001, e.gain * S.sustain), Math.min(t0 + e.time + 0.02, end - release)); out.gain.setValueAtTime(Math.max(0.0001, last.gain * S.sustain), end - release); out.gain.exponentialRampToValueAtTime(0.0001, end); const oscs = []; for (const [ratio, g] of T.partials) { const o = a.createOscillator(), og = a.createGain(); og.gain.value = g / T.partials.length; o.frequency.setValueAtTime(first.frequency * ratio, start); for (let k = 1; k < events.length; k++) { // a slur: glide to the next note without a new attack const p = events[k - 1], e = events[k], t = t0 + e.time, hold = Math.max(t0 + p.time + 0.006, t - 0.018); o.frequency.setValueAtTime(p.frequency * ratio, hold); o.frequency.exponentialRampToValueAtTime(e.frequency * ratio, Math.min(t + 0.025, end - 0.005)); } for (const e of events) { const t = t0 + e.time; o.detune.setValueAtTime(0, t); for (const [dt, cents] of e.bend ?? []) o.detune.linearRampToValueAtTime(cents, t + Math.min(dt, e.duration - 0.001)); } o.connect(og); og.connect(out); o.start(start); o.stop(end + 0.015); voices.add(o); o.onended = () => voices.delete(o); oscs.push(o); } for (const e of events) if (e.vibrato) { const [rate, depth, delay] = e.vibrato, t = t0 + e.time, lfo = a.createOscillator(), lg = a.createGain(); lfo.frequency.value = rate; lg.gain.setValueAtTime(0, start); lg.gain.setValueAtTime(0, t + delay); lg.gain.linearRampToValueAtTime(depth, Math.min(t + delay + 0.12, end)); lfo.connect(lg); for (const o of oscs) lg.connect(o.detune); lfo.start(start); lfo.stop(end + 0.015); voices.add(lfo); lfo.onended = () => voices.delete(lfo); } if (first.style === "breath") { const s = noise(a), bq = a.createBiquadFilter(), ng = a.createGain(); s.loop = true; bq.type = "bandpass"; bq.frequency.value = Math.min(8000, first.frequency * 3); bq.Q.value = 1.2; ng.gain.value = 0.035; s.connect(bq); bq.connect(ng); ng.connect(out); s.start(start); s.stop(end + 0.015); voices.add(s); s.onended = () => voices.delete(s); } } /** Plays a plan of gestures: one time origin for every part, keys lit for the melody's notes */ function playPlan(scale, plan) { stop(); const a = ctx(), n = scale.cents.length, t0 = a.currentTime + 0.1 - Math.min(0, ...plan.events.map((e) => e.time)); const groups = new Map(); plan.events.forEach((e, i) => { const k = e.legatoGroup ?? `single/${i}`; if (!groups.has(k)) groups.set(k, []); groups.get(k).push(e); }); for (const g of groups.values()) line(g, t0); for (const e of plan.percussion) hit(e.kind, t0 + e.time, e.gain); for (const e of plan.drones) drone(e.cents, t0 + e.time, e.duration); const lag = (t) => (t0 - a.currentTime + t) * 1000; for (const e of plan.events) if (e.role === "melody" && e.degree != null) { const i = ((e.degree % n) + n) % n, octave = Math.floor(e.degree / n); timers.push(setTimeout(() => listeners.forEach((fn) => fn({id: scale.id, degree: i, octave})), lag(e.time))); } const end = Math.max(...plan.events.map((e) => e.time + e.duration)); timers.push(setTimeout(() => listeners.forEach((fn) => fn(null)), lag(end + 0.5))); } // The base of a plan: the notebook's tempo, cycle and percussion for this tradition, over whole cycles function base(scale, seconds, seed) { const R = rhythmOf(scale), unit = R.free ? 0.25 : 60 / R.bpm / R.perBeat, cycleDur = R.free ? seconds : R.cycle * unit; const cycles = Math.max(1, Math.round(seconds / cycleDur)), cadenceTime = R.free ? seconds : cycles * cycleDur; const percussion = []; if (!R.free) for (let c = 0; c < cycles; c++) for (const [pu, kind, g] of R.perc ?? []) percussion.push({time: (c * R.cycle + pu) * unit, kind, gain: g}); const drones = scale.drone ? [{cents: scale.cents, time: 0, duration: cadenceTime + 1.5}] : []; return {scale, seed, unit, cycle: R.cycle, cadenceTime, percussion, drones}; } function plan(b) { return {scale: b.scale, seed: b.seed, events: [], percussion: [], drones: []}; } // a gesture: its notes (by degree of the scale, or by MIDI number for chords), its arrival points, its role and voice function begin(p, start, role = "melody", voice = "main") { return { note(offset, degree, duration, o = {}) { const e = {time: start + offset, duration, frequency: pitch(p.scale, degree, o.transpose ?? 0), degree, gain: 0.22, timbre: p.scale.timbre, role, voice, style: "pluck", ...o}; delete e.transpose; p.events.push(e); return e; }, absolute(offset, midi, duration, o = {}) { const e = {time: start + offset, duration, frequency: TONIC * 2 ** ((midi - 60) / 12), gain: 0.16, timbre: "guitar", role, voice, style: "pluck", ...o}; p.events.push(e); return e; }, }; } function support(p, b, {percussion = true, drone = true, gain = 0.6} = {}) { if (percussion) p.percussion = b.percussion.map((e) => ({...e, gain: e.gain * gain})); if (drone) p.drones = b.drones; } // a held note played as a tremolo (oud risha, santur roll, guzheng yao zhi): fast repeated strokes, the first one louder function tremolo(g, at, degree, length, {step = 0.085, ...o} = {}) { const n = Math.max(2, Math.floor(length / step)), gain = o.gain ?? 0.2; for (let k = 0; k < n; k++) g.note(at + k * step, degree, k === n - 1 ? Math.max(step, length - k * step) : step * 1.1, {...o, gain: gain * (k === 0 ? 1 : k % 2 ? 0.6 : 0.72)}); } // free rhythm: arcs of notes, each ending on a held note and its silence, stretched to fill T seconds, then a final note function arcs(p, shapes, T, r, {final = 0, finalLength = 2.4, gain = 0.2, tremoloFinal = false, step} = {}) { const sum = (x) => x.reduce((s, v) => s + v, 0), endAt = T - 1.2; const weights = shapes.map((s) => (sum(s.lengths) + s.pause) * (0.94 + r() * 0.12)), factor = endAt / sum(weights); let t = 0; shapes.forEach((s, j) => { const total = weights[j] * factor, k0 = total / (sum(s.lengths) + s.pause), g = begin(p, t); let at = 0; s.notes.forEach((d, k) => { const l = s.lengths[k] * k0, last = k === s.notes.length - 1, o = {gain: last ? gain * 1.2 : gain, ...(s.o?.(k, l, last, j) ?? {})}; if (last && s.tremolo) tremolo(g, at, d, l * 0.98, {...o, step}); else g.note(at, d, l * (last ? 0.98 : 1.03), o); at += l; }); t += total; }); const g = begin(p, endAt); if (tremoloFinal) tremolo(g, 0, final, finalLength, {gain: gain * 1.1, step}); else g.note(0, final, finalLength, {gain: gain * 1.1}); } // a melody written as [unit, degree, length in units] from a start time, with options per note function phrase(g, notes, u, o = () => ({})) { notes.forEach(([at, d, len], k) => g.note(at * u, d, len * u, o(k, d, len, at))); } const COMPOSERS = { // a 16-bar waltz: pickup, two 8-bar phrases (to V7, then back to I), bass on 1 and short chords on 2 and 3 major(scale, seed) { const q = 60 / 184, r = seeded(seed), p = {scale, seed, events: [], percussion: [], drones: []}; const H = {I: [48, [55, 60, 64]], I6: [52, [55, 60, 64]], IV: [41, [57, 60, 65]], ii6: [53, [57, 62, 65]], V7: [43, [55, 59, 62, 65]], I64: [43, [55, 60, 64]]}; const PROG = ["I", "I", "IV", "V7", "I", "ii6", "V7", "V7", "I", "I6", "IV", "ii6", "I64", "V7", "I", "I"]; const M = [[[72, 1.5], [74, 0.5], [76, 1]], [[79, 2], [76, 1]], [[77, 1], [76, 0.5], [74, 0.5], [72, 1]], [[74, 2], [67, 0.65]], [[76, 1], [79, 1], [76, 1]], [[77, 1], [76, 0.5], [74, 0.5], [69, 1]], [[71, 1], [74, 1], [77, 1]], [[79, 2.25]], [[72, 1.5], [74, 0.5], [76, 1]], [[79, 1], [76, 1], [72, 1]], [[69, 1], [72, 1], [77, 1]], [[77, 0.5], [76, 0.5], [74, 1], [69, 1]], [[67, 1], [72, 1], [76, 1]], [[77, 1], [74, 1], [71, 1]], [[72, 2], [67, 0.65]], [[72, 2.85]]]; if (r() > 0.5) M[1] = [[79, 1.5], [76, 0.5], [72, 1]]; if (r() > 0.5) M[9] = [[76, 1], [79, 1], [72, 1]]; const MAJOR = [0, 2, 4, 5, 7, 9, 11], degree = (m) => { const s = m - 60, pc = ((s % 12) + 12) % 12, k = MAJOR.indexOf(pc); return k < 0 ? null : k + 7 * Math.floor(s / 12); }; const ev = (beat, m, dur, role, gain, style, release) => p.events.push({time: beat * q, duration: dur * q, frequency: TONIC * 2 ** ((m - 60) / 12), degree: role === "melody" ? degree(m) : null, gain, timbre: "piano", role, voice: role === "melody" ? "main" : "left", style, release}); const dyn = [1, 1.02, 1.06, 0.92, 1, 1.03, 1.08, 0.86, 1, 1.02, 1.05, 0.99, 1.05, 1.09, 0.94, 0.89]; ev(0, 67, 0.82, "melody", 0.2, "piano", 0.07); // the pickup M.forEach((bar, b) => { let beat = 0; for (const [m, len] of bar) { ev(1 + 3 * b + beat, m, len * (b === 15 ? 0.98 : 0.91), "melody", 0.235 * dyn[b] * (beat === 0 ? 1.06 : 0.94), "piano", 0.07); beat += len; } }); PROG.forEach((name, b) => { const [bass, chord] = H[name], t = 1 + 3 * b; if (b === 15) { ev(t, bass, 1.8, "accompaniment", 0.27, "piano", 0.045); chord.forEach((m) => ev(t + 0.025, m, 2, "accompaniment", 0.08, "chord", 0.045)); return; } ev(t, bass, 0.5, "accompaniment", 0.29, "piano", 0.045); // beat 1: the bass chord.forEach((m) => ev(t + 1, m, 0.36, "accompaniment", 0.086, "chord", 0.045)); // beats 2 and 3: short chords chord.forEach((m) => ev(t + 2, m, 0.32, "accompaniment", 0.073, "chord", 0.045)); }); return p; }, // a 12-bar blues: riffs that call and leave room for their answer, inflected notes, a walking bass and short chords blues(scale, seed) { const b = base(scale, (12 * 4 * 60) / 104, seed), p = plan(b), u = b.unit, bar = 12 * u, r = seeded(seed); const roots = [0, 0, 0, 0, 500, 500, 0, 0, 700, 500, 0, 700]; support(p, b, {gain: 0.45, drone: false}); // AAB: a line over bars 1–4, the same line over the IV chord (bars 5–8), varied, then an answer over bars 9–12; // the melody stays in the key while the chords move, and uses every note of the scale const A = [[0, 4, 2], [2, 5, 1], [3, 6, 4], [8, 5, 1], [9, 4, 2], [11, 1, 1], [12, 0, 5], [30, 4, 1], [32, 3, 1], [33, 2, 1], [35, 1, 1], [36, 0, 4]]; const A2 = A.map((n) => n.slice()); if (r() > 0.5) A2.splice(0, 2, [0, 6, 2], [2, 5, 1]); else A2.splice(7, 4, [27, 6, 2], [29, 5, 1], [30, 4, 2], [32, 3, 1], [33, 2, 2], [35, 1, 1]); const B = [[0, 5, 2], [2, 4, 1], [3, 5, 3], [6, 4, 2], [8, 3, 1], [9, 2, 2], [11, 1, 1], [12, 2, 3], [15, 1, 2], [17, 0, 1], [18, -1, 3], [21, 0, 3], [24, 0, 6], [36, 1, 2], [38, 2, 1], [39, 3, 1], [40, 4, 4]]; [A, A2, B].forEach((line, j) => phrase(begin(p, j * 4 * bar), line, u, (k, d, len) => ({ gain: k === 0 ? 0.25 : 0.2, bend: d === 1 ? [[0, 0], [Math.min(0.1, len * u * 0.4), 45], [len * u * 0.9, 30]] // the blue third, bent up towards the major third : d === 6 && len >= 2 ? [[0, -200], [0.12, 0]] // the upper tonic, reached by bending from B♭ : d === 3 ? [[0, -40], [0.06, 0]] : undefined, // the flattened fifth, slid into vibrato: len >= 4 ? [5.5, 14, 0.25] : undefined, }))); const acc = begin(p, 0, "accompaniment", "bass"); roots.forEach((root, k) => { [0, 700, 900, 700].forEach((c, j) => acc.note(k * bar + j * 3 * u, 0, 1.7 * u, {frequency: (TONIC / 4) * 2 ** ((root + c) / 1200), gain: 0.21, timbre: "guitar", style: "muted"})); for (const t of [3, 9]) for (const c of [400, 700, 1000]) acc.note(k * bar + t * u, 0, 0.85 * u, {frequency: (TONIC / 2) * 2 ** ((root + c) / 1200), gain: 0.052, timbre: "guitar", voice: "chords", style: "muted"}); }); begin(p, 12 * bar).note(0, 0, 1.4, {gain: 0.24}); return p; }, // the quena: three four-bar arcs, each blown in groups of slurred notes, landing on a long note before a breath andes(scale, seed) { const b = base(scale, (12 * 2 * 60) / 100, seed), p = plan(b), u = b.unit, variant = seeded(seed)() > 0.5; support(p, b, {gain: 0.38, drone: false}); const ts = [0, 2, 3, 4, 8, 10, 11, 12, 16, 18, 19, 20, 24], contours = [[0, 2, 3, 2, 2, 3, 4, 3, 2, 1, 2, 1, 0], [2, 3, 4, 3, 4, 3, 2, 3, 2, 1, 2, 1, 0]]; for (let phrase = 0; phrase < 3; phrase++) { const start = phrase * 32 * u, g = begin(p, start), d = contours[phrase === 1 && variant ? 1 : 0]; ts.forEach((t, k) => { const len = k === 12 ? 4 : (ts[k + 1] - t) * 1.01, group = k < 4 ? 0 : k < 8 ? 1 : k < 12 ? 2 : 3; g.note(t * u, d[k], len * u, {gain: 0.18 * (k < 8 ? 0.82 + k * 0.035 : 1.04 - (k - 8) * 0.055), style: "breath", legatoGroup: k === 12 ? undefined : `andes/${phrase}/breath${group}`, vibrato: k === 12 ? [5.4, 11, 0.25] : undefined}); }); } begin(p, 96 * u).note(0, 0, 1.1, {gain: 0.17, style: "breath", vibrato: [5.4, 9, 0.3]}); return p; }, // the soleá: each compás launches a line, suspends it, then answers and closes on beat 10, with the guitar chords flamenco(scale, seed) { const b = base(scale, 24, seed), p = plan(b), u = b.unit, cycles = Math.max(1, Math.round(b.cadenceTime / (24 * u))), r = seeded(seed); const path = r() > 0.5 ? [4, 3, 2, 4, 3, 2, 1] : [4, 3, 4, 4, 3, 2, 1]; support(p, b, {gain: 0.52, drone: false}); for (let c = 0; c < cycles; c++) { const start = c * 24 * u, q = begin(p, start), last = c === cycles - 1; [0, 1, 2, 4, 6, 8, 10].forEach((t, k) => q.note(t * u, path[k], (k === 6 ? 1.4 : 0.8) * u, {gain: [4, 10].includes(t) ? 0.25 : 0.19})); const ans = begin(p, start + 12 * u), ts = last ? [0, 2, 4, 5, 6] : [0, 2, 4, 5, 6, 8, 10], ds = [3, 2, 1, 0, 0, 1, 0]; ts.forEach((t, k) => ans.note(t * u, ds[k], (t === 6 ? 2.6 : 0.88) * u, {gain: t === 6 ? 0.27 : 0.19, legatoGroup: t === 4 || t === 5 ? `flamenco/${c}/resolution` : undefined})); const ch = begin(p, start, "accompaniment", "chords"); for (const [t, name] of [[4, "I"], [10, "bII"], [14, "bII"], [18, "I"], ...(last ? [] : [[22, "I"]])]) (name === "I" ? [48, 55, 60, 64, 67] : [49, 56, 61, 65, 68]).forEach((m, j) => ch.absolute(t * u + j * 0.011, m, 0.22, {gain: t === 18 ? 0.082 : 0.058})); } return p; }, // jhaptal: expose the main notes, open the register in the second cycle, then lighten and return to the sam bhairav(scale, seed) { const b = base(scale, 16, seed), p = plan(b), u = b.unit, cycles = Math.max(1, Math.round(b.cadenceTime / (20 * u))), opening = seeded(seed)() > 0.5 ? [0, 2, 4, 7, 6] : [0, 3, 4, 7, 6]; support(p, b, {gain: 0.45}); for (let c = 0; c < cycles; c++) { const start = c * 20 * u, g = begin(p, start), ds = c === 1 ? opening : [0, 1, 2, 3, 4]; [0, 2, 4, 6, 8].forEach((t, k) => { if (c && k === 0) return; g.note(t * u, ds[k], (k === 4 ? 0.85 : 1.85) * u, {gain: k === 0 ? 0.26 : 0.19, style: "string", legatoGroup: k === 1 || k === 2 ? `bhairav/${c}/meend` : undefined, bend: k === 1 ? [[0, 0], [0.18, -24], [0.35, 10], [0.45, 0]] : undefined}); }); const ans = begin(p, start + 10 * u); [0, 2, 4, 6].forEach((t, k) => ans.note(t * u, [4, 3, 2, 1][k], (k === 3 ? 3.55 : 1.9) * u, {gain: 0.18, style: "string", legatoGroup: k >= 2 ? `bhairav/${c}/return` : undefined, bend: k === 3 ? [[0, 0], [0.25, -28], [0.58, 8], [0.8, 0]] : undefined})); ans.note(10 * u, 0, c === cycles - 1 ? 1.5 : 1.75 * u, {gain: 0.26, style: "string"}); } return p; }, // slendro: a skeleton struck and damped, and a higher part that anticipates its landing points slendro(scale, seed) { const b = base(scale, 16, seed), p = plan(b), u = b.unit, cycles = Math.max(1, Math.round(b.cadenceTime / (16 * u))); const motif = seeded(seed)() > 0.5 ? [1, 2, 3, 2, 4, 3, 1, 0] : [2, 3, 4, 3, 2, 1, 2, 0], ts = [0, 2, 4, 6, 8, 10, 12, 15]; support(p, b, {gain: 0.6, drone: false}); for (let c = 0; c < cycles; c++) { const start = c * 16 * u, g = begin(p, start, "melody", "part1"), up = begin(p, start, "melody", "part2"); ts.forEach((t, k) => g.note(t * u, motif[k], ((ts[k + 1] ?? 16) - t) * u - 0.04, {gain: t === 15 ? 0.24 : 0.19, style: "metal", release: 0.035})); for (const k of [2, 4, 6, 7]) { const landing = ts[k] * u, target = motif[k] + 5; up.note(landing - 1.4 * u, target - 1, 0.5 * u, {gain: 0.1, style: "metal", release: 0.025}); up.note(landing - 0.7 * u, target, 0.55 * u, {gain: 0.12, style: "metal", release: 0.025}); } } return p; }, // two parts that share one pattern, note by note, and exchange the lead: an interlocking study amadinda(scale, seed) { const b = base(scale, 16, seed), p = plan(b), u = b.unit, cycles = Math.max(1, Math.round(b.cadenceTime / (12 * u))); const shared = seeded(seed)() > 0.5 ? [0, 2, 1, 3, 2, 4, 3, 0, 4, 1, 2, 0] : [0, 3, 2, 4, 1, 3, 3, 1, 4, 0, 2, 0]; for (let c = 0; c < cycles; c++) { const start = c * 12 * u, parts = [begin(p, start, "melody", "part1"), begin(p, start, "melody", "part2")], pattern = shared.slice(); if (c % 4 === 3) { pattern[4] = (shared[4] + 1) % 5; pattern[5] = (shared[5] + 4) % 5; } for (let k = 0; k < 12; k++) { const voice = k % 2, leading = c % 4 < 2 ? 0 : 1; parts[voice].note(k * u, pattern[k], 0.76 * u, {gain: (voice === leading ? 0.22 : 0.17) * (k === 0 || k === 6 ? 1.1 : 1), style: "strike", release: 0.018}); } } begin(p, cycles * 12 * u, "melody", "part1").note(0, 0, 0.5, {gain: 0.23, style: "strike"}); return p; }, // free rhythm: four arcs (expose the low notes, take up the main note, open the register, come back), each ending // on a held note followed by its silence, over the drone hijaz(scale, seed) { const T = 16, b = base(scale, T, seed), p = plan(b), r = seeded(seed); support(p, b, {percussion: false, gain: 0.5}); const shapes = [{notes: [0, 1, 2, 3], lengths: [0.24, 0.18, 0.34, 0.85], pause: 0.65}, {notes: [3, 2, 1, 2, 3], lengths: [0.22, 0.16, 0.18, 0.28, 0.8], pause: 0.7}, {notes: [3, 4, 5, 6, 5, 4], lengths: [0.19, 0.18, 0.23, 0.52, 0.25, 0.8], pause: 0.75}, {notes: [4, 3, 2, 1, 0], lengths: [0.22, 0.3, 0.25, 0.48, 1.0], pause: 0.6}]; const sum = (x) => x.reduce((s, v) => s + v, 0), weights = shapes.map((s) => (sum(s.lengths) + s.pause) * (0.96 + r() * 0.08)), factor = (T - 1.15) / sum(weights); let t = 0; shapes.forEach((s, j) => { const total = weights[j] * factor, k0 = total / (sum(s.lengths) + s.pause), g = begin(p, t); let at = 0; s.notes.forEach((d, k) => { const l = s.lengths[k] * k0, lastNote = k === s.notes.length - 1; g.note(at, d, l * (lastNote ? 0.98 : 1.03), {gain: lastNote ? 0.24 : 0.19, legatoGroup: k === 1 || k === 2 ? `hijaz/${j}/ornament` : undefined, bend: lastNote && j < 3 ? [[0, -12], [Math.min(0.15, l * 0.4), 0]] : undefined}); at += l; }); t += total; }); begin(p, T - 1.15).note(0, 0, 2.45, {gain: 0.22}); return p; }, // an 8-bar lament in C minor: falling lines over broken chords, slow enough to breathe minor(scale, seed) { const q = 60 / 66, r = seeded(seed), p = {scale, seed, events: [], percussion: [], drones: []}; const H = {i: [48, [55, 60, 63]], iv: [41, [56, 60, 65]], V: [43, [55, 59, 62]], VI: [44, [56, 60, 63]], V7: [43, [53, 59, 62]]}; const PROG = ["i", "iv", "V", "i", "VI", "iv", "V7", "i"]; const M = [[[67, 1.5], [68, 0.5], [67, 1], [63, 1]], [[65, 1.5], [67, 0.5], [68, 1], [72, 1]], [[71, 1.5], [72, 0.5], [74, 1], [71, 1]], [[72, 3], [67, 1]], [[72, 1.5], [75, 0.5], [74, 1], [72, 1]], [[68, 1.5], [67, 0.5], [65, 1], [68, 1]], [[67, 1], [71, 1], [74, 1], [71, 1]], [[72, 3.8]]]; if (r() > 0.5) M[1] = [[65, 1], [68, 1], [72, 1.5], [68, 0.5]]; if (r() > 0.5) M[4] = [[75, 1.5], [74, 0.5], [72, 1], [67, 1]]; if (r() > 0.5) M[6] = [[74, 1], [72, 0.5], [71, 0.5], [74, 1], [71, 1]]; const MINOR = [0, 2, 3, 5, 7, 8, 11], degree = (m) => { const s = m - 60, pc = ((s % 12) + 12) % 12, k = MINOR.indexOf(pc); return k < 0 ? null : k + 7 * Math.floor(s / 12); }; const ev = (beat, m, dur, role, gain, style, release) => p.events.push({time: beat * q, duration: dur * q, frequency: TONIC * 2 ** ((m - 60) / 12), degree: role === "melody" ? degree(m) : null, gain, timbre: "piano", role, voice: role === "melody" ? "main" : "left", style, release}); const dyn = [0.95, 1, 1.05, 0.9, 1, 1.08, 1.02, 0.88]; M.forEach((bar, b) => { let beat = 0; for (const [m, len] of bar) { ev(4 * b + beat, m, len * 0.97, "melody", 0.22 * dyn[b] * (beat === 0 ? 1.05 : 0.95), "piano", 0.09); beat += len; } }); PROG.forEach((name, b) => { const [bass, chord] = H[name], t = 4 * b; ev(t, bass, b === 7 ? 3.8 : 3.6, "accompaniment", 0.2, "piano", 0.08); if (b === 7) { chord.forEach((m) => ev(t + 0.03, m, 3.8, "accompaniment", 0.06, "chord", 0.08)); return; } for (let k = 1; k < 8; k++) ev(t + k * 0.5, chord[[0, 1, 2, 1][k % 4]], 0.48, "accompaniment", 0.055, "chord", 0.06); // broken chord in quavers }); return p; }, // a slow chorale in three voices, tuned in pure intervals: two-beat chords, a 4–3 suspension at the cadence just(scale, seed) { const b = base(scale, 17, seed), p = plan(b), u = b.unit, r = seeded(seed); const S = [9, 10, 9, 8, 7, 7, [7, 6], 7], A = [4, 5, 4, 4, 2, 3, 1, 2], B = [-7, -4, -7, -3, -2, -4, -3, -7]; if (r() > 0.5) S[1] = [10, 12]; if (r() > 0.5) S[4] = [7, 9]; const voices = [[S, "melody", "soprano", 0.17], [A, "accompaniment", "alto", 0.1], [B, "accompaniment", "bass", 0.13]]; for (const [line, role, voice, gain] of voices) { const g = begin(p, 0, role, voice); line.forEach((x, k) => { const last = k === line.length - 1, notes = Array.isArray(x) ? x : [x], len = (last ? 3.5 : 2) / notes.length; notes.forEach((d, j) => g.note((2 * k + j * len) * u, d, len * u * 0.98, {gain: gain * (j && k === 6 ? 0.85 : 1), style: "organ"})); }); } return p; }, // free rhythm, as in a taqsim: around the neutral third, then up through the upper jins to the octave, and home rast(scale, seed) { const T = 16, b = base(scale, T, seed), p = plan(b), r = seeded(seed); support(p, b, {percussion: false}); const shapes = [ {notes: [0, 1, 2, 1, 2], lengths: [0.3, 0.2, 0.4, 0.2, 0.95], pause: 0.6, tremolo: true}, {notes: [2, 3, 4, 3, 4], lengths: [0.25, 0.22, 0.5, 0.2, 0.9], pause: 0.65, bend: true}, {notes: r() > 0.5 ? [4, 5, 6, 7, 6, 5, 4] : [4, 5, 7, 6, 5, 6, 4], lengths: [0.2, 0.2, 0.25, 0.6, 0.2, 0.2, 0.85], pause: 0.7, tremolo: true}, {notes: [4, 3, 2, 3, 2, 1], lengths: [0.22, 0.25, 0.3, 0.2, 0.25, 0.8], pause: 0.5}, ]; shapes.forEach((s, j) => (s.o = (k, l, last) => ({legatoGroup: k === 1 || k === 2 ? `rast/${j}/ornament` : undefined, bend: last && s.bend ? [[0, -15], [Math.min(0.15, l * 0.4), 0]] : undefined}))); arcs(p, shapes, T, r, {final: 0, tremoloFinal: true}); return p; }, // a sung line over the maqsum: the lower jins around the neutral second, a climb to the fourth and fifth, a return bayati(scale, seed) { const b = base(scale, 15.6, seed), p = plan(b), u = b.unit, r = seeded(seed); support(p, b, {gain: 0.5}); const P = [ [[0, 3, 2], [2, 2, 1], [3, 1, 1], [4, 2, 2], [6, 1, 1], [7, 0, 1], [8, 1, 2], [10, 2, 2], [12, 1, 1.5], [13.5, 0, 2.5]], r() > 0.5 ? [[0, 3, 2], [2, 4, 2], [4, 5, 3], [7, 4, 1], [8, 3, 2], [10, 4, 1], [11, 3, 1], [12, 2, 2], [14, 1, 2]] : [[0, 3, 2], [2, 5, 2], [4, 4, 1], [5, 5, 1], [6, 6, 2], [8, 5, 2], [10, 4, 2], [12, 3, 2], [14, 2, 2]], [[0, 3, 1], [1, 2, 1], [2, 1, 2], [4, 2, 1], [5, 1, 1], [6, 0, 2], [8, 1, 1], [9, 2, 1], [10, 1, 2], [12, 0, 4]], ]; P.forEach((notes, j) => phrase(begin(p, j * 16 * u), notes, u, (k, d, len, at) => ({ gain: at % 8 === 0 ? 0.25 : 0.19, bend: d === 1 && len >= 1.5 ? [[0, -25], [0.12, 0]] : undefined, // a slide into the neutral second legatoGroup: len <= 1 ? `bayati/${j}/${Math.floor(at / 2)}` : undefined, vibrato: len >= 2.5 ? [5.5, 10, 0.3] : undefined, }))); return p; }, // āvāz: phrases rolled on the santur, from below the tonic up to the high register (owj) and back, with silences shur(scale, seed) { const T = 18, b = base(scale, T, seed), p = plan(b), r = seeded(seed); support(p, b, {percussion: false}); const shapes = [ {notes: [-1, 0, 1, 0, 1, 2, 1], lengths: [0.3, 0.25, 0.1, 0.08, 0.12, 0.3, 0.9], pause: 0.8, tremolo: true}, {notes: [2, 3, 4, 3, 2, 3, 2, 1, 2], lengths: [0.2, 0.2, 0.45, 0.1, 0.1, 0.2, 0.2, 0.2, 0.9], pause: 0.9, tremolo: true}, {notes: r() > 0.5 ? [4, 5, 6, 5, 4, 5, 4, 3] : [4, 5, 6, 7, 6, 5, 4, 3], lengths: [0.2, 0.2, 0.5, 0.1, 0.1, 0.2, 0.25, 0.9], pause: 0.8, tremolo: true}, {notes: [3, 2, 1, 2, 1, 0, -1], lengths: [0.25, 0.25, 0.3, 0.1, 0.1, 0.4, 0.8], pause: 0.6}, ]; shapes.forEach((s) => (s.o = (k) => (s.lengths[k] <= 0.12 ? {gain: 0.14} : {}))); // quick flicks, as in the singer's tahrir arcs(p, shapes, T, r, {final: 0, tremoloFinal: true, gain: 0.17, step: 0.075}); return p; }, // a short ālāp over the drone (slides from ni to re to ga), then a gat in tintal for two cycles, landing on the sam yaman(scale, seed) { const b = base(scale, (2 * 32 * 60) / 152 / 2, seed), p = plan(b), u = b.unit, r = seeded(seed), off = 10.2; const alap = begin(p, 0), meend = (k) => ({style: "string", legatoGroup: `yaman/alap${k}`}); [[0, -1, 0.9, 0], [0.9, 1, 0.7, 0], [1.6, 2, 1.7, 0], [3.7, 3, 0.6, 1], [4.3, 2, 0.5, 1], [4.8, 1, 0.5, 1], [5.3, 2, 1.4, 1], [7.1, 1, 0.5, 2], [7.6, -1, 0.6, 2], [8.2, 0, 1.6, 3]] .forEach(([t, d, l, k]) => alap.note(t, d, l, {gain: 0.2, ...meend(k), vibrato: l > 1.2 ? [4.5, 8, 0.5] : undefined})); const A = [-1, 1, 2, 2, 1, 2, 3, 4, 3, 2, 1, 2, 1, -1, 1, 0], B = [2, 3, 4, 5, 6, 7, 6, 5, 4, 3, 2, 3, 2, 1, -1, 1]; const split = r() > 0.5 ? [2, 6, 10, 13] : [3, 7, 9, 14]; // beats played da-ra, in two strokes [A, B].forEach((beats, c) => { const g = begin(p, off + c * 32 * u); beats.forEach((d, k) => { if (split.includes(k)) { g.note(2 * k * u, d, 0.95 * u, {gain: 0.19, style: "string"}); g.note((2 * k + 1) * u, d + 1, 0.95 * u, {gain: 0.15, style: "string"}); } else g.note(2 * k * u, d, 1.9 * u, {gain: k === 0 ? 0.26 : 0.19, style: "string"}); }); }); begin(p, off + 64 * u).note(0, 0, 1.8, {gain: 0.27, style: "string", vibrato: [4.5, 6, 0.6]}); p.percussion = [...b.percussion.map((e) => ({...e, time: e.time + off, gain: e.gain * 0.45})), {time: off + 64 * u, kind: "dayan", gain: 0.5}, {time: off + 64 * u, kind: "bayan", gain: 0.5}]; p.drones = [{cents: scale.cents, time: 0, duration: off + 64 * u + 2.5}]; return p; }, // a core melody on the gong circle, and the ranat weaving four notes around each of its notes, to arrive on the next thai(scale, seed) { const b = base(scale, 13, seed), p = plan(b), u = b.unit, r = seeded(seed); support(p, b, {gain: 0.5, drone: false}); const CORE = [4, 2, 1, 2, 4, 5, 4, 2, 1, 2, 4, 5, 4, 2, 1, 0], spans = 32; const PATTERNS = [[0, 1, 0, "n"], [0, -1, 0, "n"], [0, 2, 1, "n"], [0, "n", 0, "n"], [1, 0, -1, "n"]]; const core = begin(p, 0, "accompaniment", "khong"), ranat = begin(p, 0, "melody", "ranat"); for (let i = 0; i < spans; i++) { const a = CORE[i % 16], n = i === spans - 1 ? 0 : CORE[(i + 1) % 16], pat = PATTERNS[Math.floor(r() * PATTERNS.length)]; core.note(2 * i * u, a, 1.9 * u, {gain: 0.13, timbre: "gong", style: "metal", release: 0.03}); if (i === spans - 1) break; pat.forEach((x, k) => ranat.note((2 * i + k / 2) * u, 7 + (x === "n" ? n : a + x), 0.48 * u, {gain: k === 0 ? 0.17 : 0.13, style: "strike", release: 0.02})); } ranat.note(2 * (spans - 1) * u, 7, 1.2, {gain: 0.18, style: "strike"}); return p; }, // a slow gongan: the balungan skeleton, damped, and a bonang part that alternates its tones to anticipate each one pelog(scale, seed) { const b = base(scale, 16, seed), p = plan(b), u = b.unit; support(p, b, {gain: 0.6, drone: false}); const motif = seeded(seed)() > 0.5 ? [1, 2, 4, 2, 5, 4, 2, 0] : [4, 5, 4, 2, 1, 2, 1, 0]; const bal = begin(p, 0, "melody", "balungan"), bonang = begin(p, 0, "accompaniment", "bonang"); motif.forEach((d, k) => { const t = (2 * k + 1) * u, x = k ? motif[k - 1] : motif[7]; bal.note(t, d, k === 7 ? 2.5 : 2 * u - 0.05, {gain: k === 7 ? 0.24 : 0.19, style: "metal", release: 0.035}); [x, d, x, d].forEach((y, j) => bonang.note(t + (j / 2 - 1.5) * u, y + 7, 0.45 * u, {gain: j === 3 ? 0.11 : 0.085, style: "metal", release: 0.03})); }); return p; }, // two phrases on the guzheng: a glissando into each, slides from below, tremolo on long notes, the left hand an octave down gong(scale, seed) { const u = 0.25, bar = 8, r = seeded(seed), p = {scale, seed, events: [], percussion: [], drones: []}; const b = base(scale, 16, seed); support(p, b, {gain: 0.45, drone: false}); const BARS = [ [[0, 2, 3], [3, 3, 1], [4, 4, 2], [6, 5, 2]], [[0, 4, 2], [2, 3, 2], [4, 2, 4]], r() > 0.5 ? [[0, 2, 2], [2, 3, 1], [3, 2, 1], [4, 1, 2], [6, 0, 2]] : [[0, 3, 2], [2, 2, 1], [3, 1, 1], [4, 2, 2], [6, 0, 2]], [[0, 1, 3], [3, 2, 1], [4, 1, 4]], [[0, 5, 3], [3, 6, 1], [4, 5, 2], [6, 4, 2]], r() > 0.5 ? [[0, 3, 2], [2, 4, 2], [4, 3, 4]] : [[0, 4, 1], [1, 5, 1], [2, 4, 2], [4, 3, 4]], [[0, 2, 2], [2, 3, 1], [3, 2, 1], [4, 1, 2], [6, 2, 2]], [[0, 0, 8]], ]; BARS.forEach((notes, j) => { const g = begin(p, j * bar * u), lh = begin(p, j * bar * u, "accompaniment", "left"); if (j === 0 || j === 4 || j === 7) for (let k = 0; k < 6; k++) g.note(-0.3 + k * 0.045, notes[0][1] - 6 + k, 0.08, {gain: 0.06, role: "gliss"}); // the sweep notes.forEach(([at, d, len], k) => { if (len >= 4) return tremolo(g, at * u, d, len * u * (j === 7 ? 1.1 : 0.98), {gain: 0.17, step: 0.07}); const slide = k > 0 && len >= 2 && r() > 0.45; g.note(at * u, d, len * u * 1.02, {gain: at === 0 ? 0.23 : 0.19, bend: slide ? [[0, -200], [0.14, 0]] : undefined, vibrato: len >= 2 && !slide ? [5.5, 16, 0.15] : undefined}); }); lh.note(0, notes[0][1] - 5, 1.4, {gain: 0.08}); }); return p; }, // a min'yō: a call on the flute, with turns (kobushi) into its long notes, the chorus answering, shamisen and taiko yo(scale, seed) { const b = base(scale, 18.4, seed), p = plan(b), u = b.unit, r = seeded(seed); support(p, b, {gain: 0.5, drone: false}); const CALLS = [[[0, 3, 4], [4, 4, 2], [6, 5, 2], [8, 4, 3], [11, 3, 1], [12, 2, 4]], r() > 0.5 ? [[0, 5, 4], [4, 6, 2], [6, 5, 2], [8, 4, 2], [10, 3, 2], [12, 4, 4]] : [[0, 4, 2], [2, 5, 2], [4, 6, 4], [8, 5, 2], [10, 4, 2], [12, 3, 4]]]; const ANSWERS = [[[0, 2, 1], [1, 2, 1], [2, 3, 2], [4, 2, 2], [6, 1, 2], [8, 0, 1], [9, 0, 1], [10, 1, 2], [12, 0, 4]], [[0, 3, 1], [1, 3, 1], [2, 2, 2], [4, 1, 2], [6, 2, 2], [8, 1, 1], [9, 0, 1], [10, 1, 2], [12, 0, 4]]]; [0, 1].forEach((j) => { const start = j * 32 * u, call = begin(p, start, "melody", "voice"); CALLS[j].forEach(([at, d, len], k) => { const group = `yo/${j}/${k}`; if (len >= 3) { call.note(at * u - 0.13, d + 1, 0.07, {gain: 0.13, timbre: "flute", style: "breath", legatoGroup: group}); call.note(at * u - 0.06, d, 0.06, {gain: 0.14, timbre: "flute", style: "breath", legatoGroup: group}); } call.note(at * u, d, len * u, {gain: 0.18, timbre: "flute", style: "breath", legatoGroup: group, vibrato: len >= 3 ? [5.5, 20, 0.35] : undefined}); }); phrase(begin(p, start + 16 * u, "melody", "chorus"), ANSWERS[j], u, (k, d, len) => ({gain: 0.2, timbre: "sanshin", style: "pluck"})); const sh = begin(p, start, "accompaniment", "shamisen"); for (let k = 0; k < 8; k++) sh.note(2 * k * u, k % 2 ? -2 : -5, 0.9 * u, {gain: 0.07, timbre: "sanshin", style: "pluck"}); }); return p; }, // koto phrases separated by silences (ma): a note pressed after its pluck, one pulled down, octaves at a phrase end in(scale, seed) { const T = 17, b = base(scale, T, seed), p = plan(b), r = seeded(seed); const shapes = [ {notes: [0, 2, 3, 4, 3], lengths: [0.35, 0.3, 0.3, 0.55, 1.1], pause: 1.1, o: (k, l, last) => (last ? {bend: [[0, 0], [l * 0.35, 0], [l * 0.55, 100]]} : {})}, // ato-oshi: pressed after the pluck {notes: [5, 4, 3, 4, 3, 2], lengths: [0.3, 0.25, 0.35, 0.25, 0.3, 1.2], pause: 1.2, o: (k, l, last) => (last ? {bend: [[0, 0], [l * 0.4, 0], [l * 0.6, -40]]} : {})}, // hiki-iro: pulled down {notes: r() > 0.5 ? [3, 4, 5, 6, 5] : [3, 5, 4, 6, 5], lengths: [0.3, 0.3, 0.4, 0.5, 1.2], pause: 1.2}, {notes: [4, 3, 2, 1], lengths: [0.3, 0.4, 0.5, 0.9], pause: 0.4, o: (k, l, last) => (last ? {bend: [[0, -100], [0.18, 0]]} : {})}, // oshide: a pressed semitone ]; arcs(p, shapes, T, r, {final: 0, finalLength: 3, gain: 0.22}); const third = p.events.filter((e) => e.degree === 5).at(-1); // the octave doubling (awasezume) if (third) p.events.push({...third, degree: 0, frequency: third.frequency / 2, gain: third.gain * 0.6, role: "accompaniment"}); return p; }, // eisā: a swung sanshin melody, with hammered and pulled pairs of notes, over taiko and claps ryukyu(scale, seed) { const R = rhythmOf(scale), b = base(scale, 13.3, seed), p = plan(b), u = b.unit, r = seeded(seed), swing = R.swing ?? 0; support(p, b, {gain: 0.5, drone: false}); const sw = (x) => (x + (Math.floor(x) % 2 === 1 ? swing : 0)) * u; const P = [[[0, 3, 2], [2, 4, 1], [3, 5, 1], [4, 4, 2], [6, 3, 2], [8, 2, 1], [9, 1, 1], [10, 2, 2], [12, 3, 4]], r() > 0.5 ? [[0, 5, 2], [2, 4, 1], [3, 3, 1], [4, 4, 2], [6, 5, 2], [8, 6, 2], [10, 5, 1], [11, 4, 1], [12, 5, 4]] : [[0, 5, 1], [1, 6, 1], [2, 5, 2], [4, 4, 2], [6, 3, 1], [7, 4, 1], [8, 5, 2], [10, 4, 2], [12, 5, 4]], [[0, 3, 1], [1, 4, 1], [2, 3, 1], [3, 2, 1], [4, 1, 2], [6, 2, 1], [7, 1, 1], [8, 0, 2], [10, 1, 2], [12, 2, 4]], [[0, 3, 2], [2, 2, 1], [3, 1, 1], [4, 2, 2], [6, 3, 2], [8, 1, 1], [9, 2, 1], [10, 1, 2], [12, 0, 4]]]; P.forEach((notes, j) => { const g = begin(p, j * 16 * u), lo = begin(p, j * 16 * u, "accompaniment", "low"); notes.forEach(([at, d, len], k) => { const pair = len === 1 ? `ryukyu/${j}/${Math.floor(at / 2)}` : undefined; g.note(sw(at), d, len * u * (len === 1 ? 1.05 : 0.95), {gain: at % 4 === 0 ? 0.23 : 0.18, legatoGroup: pair}); // hammer-ons and pull-offs: two notes, one stroke if (at % 8 === 0) lo.note(sw(at), d - 5, 1.4 * u, {gain: 0.08}); }); }); return p; }, // the washint (bamboo flute) in long, ornamented phrases over a krar ostinato in 6/8, with the kebero drum bati(scale, seed) { const b = base(scale, 12.3, seed), p = plan(b), u = b.unit, r = seeded(seed), cycles = 8; support(p, b, {gain: 0.5, drone: false}); const krar = begin(p, 0, "accompaniment", "krar"), ost = r() > 0.5 ? [0, 3, 2, 0, 3, 1] : [0, 2, 3, 0, 1, 2]; for (let c = 0; c < cycles; c++) ost.forEach((d, k) => krar.note((6 * c + k) * u, d - 5, 0.95 * u, {gain: k === 0 ? 0.13 : 0.1, timbre: "krar"})); krar.note(6 * cycles * u, -5, 1.6, {gain: 0.13, timbre: "krar"}); const P = [[[0, 3, 3], [3, 4, 1], [4, 5, 1], [5, 4, 1], [6, 3, 5], [11, 2, 1]], [[0, 3, 2], [2, 2, 1], [3, 1, 2], [5, 2, 1], [6, 1, 1], [7, 0, 5]], [[0, 5, 3], [3, 6, 1], [4, 5, 1], [5, 4, 1], [6, 5, 4], [10, 4, 1], [11, 3, 1]], [[0, 2, 2], [2, 1, 1], [3, 2, 1], [4, 1, 1], [5, 0, 7]]]; P.forEach((notes, j) => phrase(begin(p, j * 12 * u, "melody", "washint"), notes, u, (k, d, len, at) => ({ gain: len >= 3 ? 0.19 : 0.15, timbre: "flute", style: "breath", vibrato: len >= 3 ? [5.8, 14, 0.3] : undefined, legatoGroup: len <= 1 || notes[k - 1]?.[2] <= 1 ? `bati/${j}/${notes.findIndex((n, i) => i >= k && n[2] > 1)}` : undefined, // a run slurred into its long note }))); return p; }, // a balafon: a two-hand ostinato over the bell, varied, then a descending run of thirds, then the ostinato and home balafon(scale, seed) { const b = base(scale, 16.4, seed), p = plan(b), u = b.unit, r = seeded(seed), cycles = 8; support(p, b, {gain: 0.5, drone: false}); const OST = [0, 4, 2, -2, 4, 2, 0, 5, 4, -3, 2, 4], left = new Set([0, 3, 6, 9]); const L = begin(p, 0, "melody", "left"), Rh = begin(p, 0, "melody", "right"); for (let c = 0; c < cycles; c++) for (let k = 0; k < 12; k++) { const t = (12 * c + k) * u, run = c === 4 || c === 5; if (left.has(k)) { L.note(t, OST[k], 0.9 * u, {gain: k === 0 || k === 6 ? 0.21 : 0.18, style: "strike"}); continue; } if (run) { const i = 8 * (c - 4) + [1, 2, 4, 5, 7, 8, 10, 11].indexOf(k), d = 14 - Math.floor(i / 2) - (i % 2 ? 2 : 0); Rh.note(t, d, 0.9 * u, {gain: 0.17, style: "strike"}); continue; } let d = OST[k]; if ((c === 2 || c === 3 || c === 6) && (k === 7 || k === 8)) d = r() > 0.5 ? d + 1 : d - 1; // a variation of the right hand Rh.note(t, d, 0.9 * u, {gain: 0.15, style: "strike"}); } L.note(12 * cycles * u, 0, 0.8, {gain: 0.22, style: "strike"}); Rh.note(12 * cycles * u, 7, 0.8, {gain: 0.18, style: "strike"}); return p; }, }; // what each composed study plays, for the label under the scale const GESTURE_LABELS = { major: "a short composed waltz: bass on 1, chords on 2 and 3, 184 beats a minute", blues: "a 12-bar blues shuffle: a line, the same over the IV chord, an answer, 104 beats a minute", andes: "huayno phrases blown in slurred groups, with breaths", flamenco: "soleá compás, lines that close on beat 10 with the guitar", bhairav: "jhaptal, 10 beats, phrases that return to the sam", slendro: "a 16-beat cycle: a struck skeleton and a higher answer", amadinda: "two interlocking parts sharing one pattern", hijaz: "free rhythm, as in a taqsim: expose, open, return", minor: "a short lament in 4/4, a falling melody over broken chords, 66 beats a minute", just: "a slow chorale in three voices, in pure intervals, with a suspension at the cadence", rast: "free rhythm, as in a taqsim: around the neutral third, up to the octave, home", bayati: "a sung line over the maqsum, dum tek – tek dum – tek –", shur: "āvāz: phrases rolled on the santur, up to the high register and back", yaman: "a short ālāp, then a gat in tintal that lands on the sam", thai: "a core melody on gongs, the ranat weaving around it, ching and chap", pelog: "a slow gongan: the balungan skeleton, and a bonang part anticipating it", gong: "two phrases on the guzheng: glissandi, slides, tremolo on long notes", yo: "a min'yō call and its chorus, over shamisen and taiko", in: "koto phrases with pressed and pulled notes, separated by silences (ma)", ryukyu: "eisā: a swung sanshin melody with hammered notes, over taiko", bati: "washint flute phrases over a krar ostinato in 6/8, with the kebero", balafon: "a two-hand balafon ostinato, a descending run, then home, over the bell", }; /** What Generate really plays for this scale */ const playLabel = (scale) => GESTURE_LABELS[scale.id] ?? tempoLabel(rhythmOf(scale)); // ── The clock of the octave ───────────────────────────────────────── /** The octave as a circle: 12 grey ticks for the piano's semitones, the scale's notes as dots at their exact cents */ function clock(d3, scale, {size = 180, colour = "#b5452a"} = {}) { const r = size / 2 - 22, svg = d3.create("svg").attr("width", size).attr("height", size).attr("viewBox", [-size / 2, -size / 2, size, size]) .style("font", "10px system-ui, sans-serif").style("overflow", "visible"); const at = (c, rr = r) => [Math.sin((c / 1200) * 2 * Math.PI) * rr, -Math.cos((c / 1200) * 2 * Math.PI) * rr]; svg.append("circle").attr("r", r).attr("fill", "none").attr("stroke", "#ccc"); for (let k = 0; k < 12; k++) { const [x1, y1] = at(k * 100, r - 4), [x2, y2] = at(k * 100, r + 4); svg.append("line").attr("x1", x1).attr("y1", y1).attr("x2", x2).attr("y2", y2).attr("stroke", "#bbb"); } const pts = scale.cents.map((c) => at(c)); svg.append("path").attr("d", d3.line()([...pts, pts[0]])).attr("fill", colour).attr("fill-opacity", 0.08).attr("stroke", colour).attr("stroke-opacity", 0.4); const dots = svg.append("g").selectAll("g").data(scale.cents).join("g"); dots.append("circle").attr("cx", (c) => at(c)[0]).attr("cy", (c) => at(c)[1]).attr("r", 5.5).attr("fill", colour).attr("stroke", "white").attr("stroke-width", 1.5); dots.append("text").attr("x", (c) => at(c, r + 14)[0]).attr("y", (c) => at(c, r + 14)[1] + 3.5).attr("text-anchor", "middle").attr("fill", "#555").text((c) => c); svg.append("text").attr("y", 4).attr("text-anchor", "middle").attr("fill", "#999").text("cents"); const off = onNote((e) => dots.select("circle").attr("r", (c, i) => (e && e.id === scale.id && e.degree === i ? 9 : 5.5))); svg.node().dispose = off; return svg.node(); } // ── Recordings ────────────────────────────────────────────────────── // One recording per tradition on YouTube, embedded (privacy-enhanced domain), starting at a typical passage. // The melodies' tempos were matched to these recordings. Where a recording illustrates the rhythm rather than // the exact mode, the caption says so. const RECORDINGS = { minor: {id: "r2-asx8cY0s", start: 0, label: "Mozart, Symphony No. 40 in G minor (Vienna, 1788), first movement, Vienna Philharmonic"}, major: {id: "woWJqKznCSc", start: 90, label: "Johann Strauss II, The Blue Danube, Vienna Philharmonic, Riccardo Muti"}, just: {id: "dU7k-hiiVjw", start: 0, label: "Palestrina, Sicut cervus, VOCES8: unaccompanied voices tune their chords by ear, close to just intonation"}, blues: {id: "5jcGY7NbaQw", start: 0, label: "Elmore James, Dust My Broom (1951)"}, andes: {id: "iU86vter5a8", start: 0, label: "Valicha, a huayno from Cusco, on quena"}, flamenco: {id: "TMbPMmOI9Lo", start: 60, label: "Paco de Lucía, soleá"}, hijaz: {id: "OCmheJ929fo", start: 0, label: "Simon Shaheen, Taqasim Hijaz (1987): an improvisation on the oud, in free rhythm"}, rast: {id: "gYfmvkiPsWg", start: 0, label: "Riad al-Sunbati, Taqasim Rast: an improvisation on the oud, in free rhythm"}, bayati: {id: "nM-5vYq-WKM", start: 0, label: "Munir Bashir, Maqam Bayat, oud (Baghdad)"}, shur: {id: "oa2qCTQF02M", start: 0, label: "Mohammad Reza Shajarian, Saz va Avaz Shur"}, yaman: {id: "axaJappUx5M", start: 180, label: "Purbayan Chatterjee, raga Yaman in madhya laya (medium tempo), sitar and tabla"}, bhairav: {id: "FNkkFWbkFSo", start: 0, label: "Raga Bhairav, a sargam geet in jhaptal"}, thai: {id: "ZhNoTzhzYHg", start: 40, label: "A piphat ensemble, the Siam Society, Bangkok"}, slendro: {id: "vxDzZdsU7X0", start: 40, label: "Lancaran Gembiro Loka, laras slendro, Yogyakarta"}, pelog: {id: "E6LxHiIzAuQ", start: 90, label: "Ladrang Sarayuda Rinengga, laras pelog barang"}, gong: {id: "Y9NCFzvGqJw", start: 30, label: "Mo li hua (Jasmine flower), guzheng quartet"}, yo: {id: "IkJVnYfctME", start: 20, label: "Soran bushi, a min'yō from Hokkaido, Victor Shōnen Min'yōkai"}, in: {id: "JDTp_YQizqE", start: 0, label: "Sakura, the textbook melody of the in scale, Kasumi Watanabe on a 25-string koto"}, ryukyu: {id: "Rj_Sipp16iE", start: 40, label: "Sanshin no hana, Okinawa Taiko"}, bati: {id: "E8i4A030kMI", start: 40, label: "Maritu Legesse, Bati"}, amadinda: {id: "6KrYB9f9fsw", start: 0, label: "Amadinda, traditional music of Buganda"}, balafon: {id: "mLf_2ZXoXNo", start: 0, label: "Famoro Dioubaté, balafon solo"}, }; // ── The keyboard ──────────────────────────────────────────────────── /** One octave of a piano, from C to the upper C: the keys the scale uses are marked, and notes that fall between * keys are drawn where they really are, with their distance to the nearest key in cents */ function keys(d3, scale, {width = 300, colour = "#b5452a"} = {}) { const W = width / 8, h = 64, bh = h * 0.62, bw = W * 0.58; const WHITE = [0, 2, 4, 5, 7, 9, 11, 12], BLACK = [1, 3, 6, 8, 10], NAMES = ["C", "D", "E", "F", "G", "A", "B", "C"]; // the centre of semitone k on the keyboard: white keys in the middle of their key, black keys between two whites const centre = (k) => (WHITE.includes(k) ? (WHITE.indexOf(k) + 0.5) * W : WHITE.indexOf(k + 1) * W); const x = (c) => { const k = Math.floor(c / 100), f = c / 100 - k; return centre(k) + f * (centre(Math.min(12, k + 1)) - centre(k)); }; const degreeOf = (k) => scale.cents.findIndex((c) => Math.abs(c - 100 * k) <= 15); const used = (k) => degreeOf(k % 12) >= 0; // the upper C is lit with the tonic const svg = d3.create("svg").attr("width", width + 2).attr("height", h + 26).attr("viewBox", [-1, -10, width + 2, h + 26]) .style("font", "9px system-ui, sans-serif").style("overflow", "visible").style("display", "block"); const markers = new Map(); // degree → marker, to light it as it sounds let upper = null; // the upper C, lit when the tonic sounds an octave up const whites = svg.append("g").selectAll("g").data(WHITE).join("g"); whites.append("rect").attr("x", (k, i) => i * W + 0.5).attr("width", W - 1).attr("height", h).attr("rx", 3) .attr("fill", (k) => (used(k) ? "#f6ddd5" : "#fff")).attr("stroke", "#888").attr("stroke-width", 0.8); whites.append("text").attr("x", (k, i) => (i + 0.5) * W).attr("y", h - 5).attr("text-anchor", "middle").attr("fill", "#999").text((k, i) => NAMES[i]); whites.filter(used).append("circle").attr("cx", (k) => centre(k)).attr("cy", h - 20).attr("r", W * 0.17).attr("fill", colour) .each(function (k) { if (k < 12) markers.set(degreeOf(k), d3.select(this)); else upper = d3.select(this); }); const blacks = svg.append("g").selectAll("g").data(BLACK).join("g"); blacks.append("rect").attr("x", (k) => centre(k) - bw / 2).attr("width", bw).attr("height", bh).attr("rx", 2) .attr("fill", (k) => (used(k) ? colour : "#222")); blacks.filter(used).append("circle").attr("cx", (k) => centre(k)).attr("cy", bh - 9).attr("r", W * 0.13).attr("fill", "#fff") .each(function (k) { markers.set(degreeOf(k), d3.select(this)); }); // notes between the keys: a line at their true place, a dot above, their offset below const off = scale.cents.map((c, i) => [c, i]).filter(([c]) => Math.abs(c - 100 * Math.round(c / 100)) > 15); const g = svg.append("g").selectAll("g").data(off).join("g"); g.append("line").attr("x1", ([c]) => x(c)).attr("x2", ([c]) => x(c)).attr("y1", -4).attr("y2", h).attr("stroke", colour).attr("stroke-width", 1.5).attr("stroke-dasharray", "3 2"); g.append("circle").attr("cx", ([c]) => x(c)).attr("cy", -5).attr("r", 4).attr("fill", colour).each(function ([, i]) { markers.set(i, d3.select(this)); }); g.append("text").attr("x", ([c]) => x(c)).attr("y", h + 12).attr("text-anchor", "middle").attr("fill", colour) .text(([c]) => { const dv = Math.round(c - 100 * Math.round(c / 100)); return (dv > 0 ? "+" : "−") + Math.abs(dv) + " ¢"; }); // small deviations (just intonation): noted under their key svg.append("g").selectAll("text").data(scale.cents.filter((c) => { const dv = Math.abs(c - 100 * Math.round(c / 100)); return dv >= 5 && dv <= 15; })).join("text") .attr("x", (c) => centre(Math.round(c / 100))).attr("y", h + 12).attr("text-anchor", "middle").attr("fill", "#999") .text((c) => { const dv = Math.round(c - 100 * Math.round(c / 100)); return (dv > 0 ? "+" : "−") + Math.abs(dv); }); const base = new Map([...markers].map(([i, m]) => [i, +m.attr("r")])); const ru = upper ? +upper.attr("r") : 0; onNote((e) => { const mine = e && e.id === scale.id, high = mine && e.degree === 0 && e.octave >= 1 && upper; for (const [i, m] of markers) m.attr("r", mine && e.degree === i && !(i === 0 && high) ? base.get(i) * 1.7 : base.get(i)); if (upper) upper.attr("r", high ? ru * 1.7 : ru); }); return svg.node(); } /** Generate: a short piece composed in the gestures of the tradition, with a new seed at each click */ const generate = (scale) => playPlan(scale, COMPOSERS[scale.id](scale, Math.floor(Math.random() * 1e6))); // ── Player: name, clock and buttons ───────────────────────────────── function player(d3, html, scale, {size = 170, compact = false} = {}) { const label = html`${playLabel(scale)}`; const rec = RECORDINGS[scale.id], box = html`

`; const toggle = () => { // opens (or closes) the embedded recording; one sound at a time const open = !!box.firstChild; stop(); // silences the synthesiser and closes any recording if (open) return; const src = `https://www.youtube-nocookie.com/embed/${rec.id}?start=${rec.start}&autoplay=1`; box.replaceChildren(html`

${rec.label}

`); openBoxes.add(box); }; const button = (label, fn) => { const b = html``; b.onclick = fn; return b; }; const el = html`

${clock(d3, scale, {size})}

${scale.name} · ${scale.local}

${scale.place} · ${scale.cents.length} notes${scale.drone ? " · over a drone" : ""} · ${label}

${keys(d3, scale)}

${compact ? "" : html`

${scale.note}

${button("▶ Scale", () => playScale(scale))}${button("♪ Generate", () => generate(scale))}${button("■ Stop", stop)}${rec ? button("🎧 Recording", toggle) : ""}

${box}

`; return el; } // ── The world map ─────────────────────────────────────────────────── /** Places on a Winkel tripel map; a click selects the place's first scale (or cycles through its scales) and plays it */ function worldMap(d3, land, {width = 900, onSelect = () => {}, selected = null} = {}) { const projection = geoWinkel3().fitWidth(width - 16, {type: "Sphere"}); const [[, y0], [, y1]] = d3.geoPath(projection).bounds({type: "Sphere"}), height = Math.ceil(y1 - y0) + 16; projection.translate([projection.translate()[0] + 8, projection.translate()[1] - y0 + 8]); const path = d3.geoPath(projection); const svg = d3.create("svg").attr("width", width).attr("height", height).attr("viewBox", [0, 0, width, height]) .style("max-width", "100%").style("height", "auto").style("font", "12px system-ui, sans-serif"); svg.append("path").attr("d", path({type: "Sphere"})).attr("fill", "#f3f1ec"); svg.append("path").attr("d", path(land)).attr("fill", "#dcd6cb"); const places = d3.groups(SCALES, (s) => s.place).map(([place, scales]) => ({place, scales, xy: projection([scales[0].lon, scales[0].lat])})); const colour = d3.scaleOrdinal(FAMILIES, d3.schemeTableau10); const g = svg.append("g").selectAll("g").data(places).join("g").attr("transform", (d) => `translate(${d.xy})`).style("cursor", "pointer"); g.append("circle").attr("r", (d) => 6 + 2 * d.scales.length).attr("fill", (d) => colour(d.scales[0].family)).attr("fill-opacity", 0.85).attr("stroke", "white").attr("stroke-width", 1.5); const SIDE = {Venice: "left", Baghdad: "left", "Xi'an": "left", Cairo: "below"}; // labels moved away from neighbours const off = (d) => 10 + 2 * d.scales.length; g.append("text").attr("x", (d) => (SIDE[d.place] === "left" ? -off(d) : SIDE[d.place] === "below" ? 0 : off(d))) .attr("y", (d) => (SIDE[d.place] === "below" ? off(d) + 8 : 4)) .attr("text-anchor", (d) => (SIDE[d.place] === "left" ? "end" : SIDE[d.place] === "below" ? "middle" : "start")).text((d) => d.place).attr("fill", "#333") .attr("stroke", "#f3f1ec").attr("stroke-width", 3).attr("paint-order", "stroke"); g.append("title").text((d) => d.scales.map((s) => s.name).join("\n")); let current = selected; g.on("click", (event, d) => { const ids = d.scales.map((s) => s.id), k = ids.indexOf(current); current = ids[(k + 1) % ids.length]; // a second click on the same place moves to its next scale const scale = SCALES.find((s) => s.id === current); onSelect(scale); playScale(scale); }); // legend const lg = svg.append("g").attr("transform", `translate(14, ${height - 14 - 16 * FAMILIES.length})`); FAMILIES.forEach((f, i) => { lg.append("circle").attr("cx", 6).attr("cy", i * 16).attr("r", 5).attr("fill", colour(f)); lg.append("text").attr("x", 16).attr("y", i * 16 + 4).text(f).attr("fill", "#555"); }); return svg.node(); } const byId = (id) => SCALES.find((s) => s.id === id); /** Several players one after the other */ function players(d3, html, ids, options) { return html`

${ids.map((id) => player(d3, html, byId(id), options))}

`; } return {SCALES, FAMILIES, stop, onNote, playScale, RHYTHMS, RHYTHM_OF, rhythmOf, tempoLabel, RECORDINGS, keys, generate, COMPOSERS, playPlan, clock, player, worldMap, byId, players}; }3e:[] 38:{"id":"6348479fe9f55ece","slug":"30-day-map-challenge-2026-day-11-senses-sound","title":"Day 11: Senses: Sound","thumbnail":"899c8914232bcbb57fe4438a770f06b0b1e537015e84c37dd6857148d41c5601","access_level":"public","create_time":"$D2026-11-08T10:22:38.124Z","update_time":"$D2026-11-08T19:57:39.485Z","view_time":null,"first_public_time":"$D2026-11-10T20:48:49.791Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"6b95df6ccdd0cd40","login":"xoolive","name":"Xavier Olive","avatar_url":"https://avatars-next.observableusercontent.com/e055a445877c5a8ee2da134a257760536c2d1ee2fcd43f3aaf3f40db54e13733","tier":"starter_2024","bio":"Research scientist. I like maps, code and data visualisation. I keep an eye on anything that can fly, an ear for fipradio and a foot ready for next trail.","followed_by_you":false,"follows_you":false},"version":139,"publish_version":139,"role":null,"authored":false,"authors":[{"type":"individual","id":"0b2e8d88aeec5ab4","login":"xoolive","name":"Xavier Olive","avatar_url":"https://avatars-next.observableusercontent.com/e055a445877c5a8ee2da134a257760536c2d1ee2fcd43f3aaf3f40db54e13733","tier":null,"bio":"Research scientist. I like maps, code and data visualisation. I keep an eye on anything that can fly, an ear for fipradio and a foot ready for next trail.","followed_by_you":false,"follows_you":false}],"members":[{"type":"team","id":"6b95df6ccdd0cd40","login":"xoolive","name":"Xavier Olive","avatar_url":"https://avatars-next.observableusercontent.com/e055a445877c5a8ee2da134a257760536c2d1ee2fcd43f3aaf3f40db54e13733","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"a749676c7f0928cb","slug":"30-day-map-challenge","title":"30 day map challenge","owner":{"id":"6b95df6ccdd0cd40","login":"xoolive","name":"Xavier Olive"}},"type":"notebook","body":{"titling":"auto","title":"Day 11: Senses: Sound","cells":[{"id":1,"value":"$${nav(11)}\n\n# Day 11: Senses: Sound\n\nEvery musical tradition picks a few notes out of the continuous range of pitches and calls them a scale. Western classical music settled on seven notes out of twelve equal semitones, but a koto player in Kyoto, an oud player in Cairo or a gamelan in Yogyakarta choose differently, and sometimes choose notes that fall *between* the keys of a piano.\n\n**Turn the sound on**, then click a place on the map to hear its scale, and listen to a real recording of the tradition. *Generate* plays a short piece composed for the page in the scale, rhythm and gestures of each tradition: this part is an experiment, synthesised sounds rather than musicians, so take it as a sketch.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"viewof chosen = {\n // the map: a click selects a scale and plays it\n const node = sc.worldMap(d3, land, {width: Math.min(width, 960), onSelect: (s) => { node.value = s; node.dispatchEvent(new Event(\"input\", {bubbles: true})); }});\n node.value = sc.SCALES[0];\n return node;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":3,"value":"{\n // the scale chosen on the map; when its place has other scales, a small link to each, just above the keyboard\n const others = sc.SCALES.filter((s) => s.place === chosen.place && s.id !== chosen.id);\n const panel = sc.player(d3, html, chosen);\n if (others.length) {\n const links = html`

${others.map((s) => {\n const a = html`» ${s.name}`;\n a.onclick = (event) => { event.preventDefault(); const v = viewof chosen; v.value = s; v.dispatchEvent(new Event(\"input\", {bubbles: true})); sc.playScale(s); };\n return a;\n })}

`;\n panel.querySelector('div[style*=\"margin:2px 0 6px\"]').before(links);\n }\n return panel;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"## Start from the piano\n\nA note one octave above another vibrates exactly twice as fast. Modern Western music divides this octave into twelve identical steps, the semitones of equal temperament, each multiplying the frequency by the twelfth root of two. Musicians measure intervals in *cents*: 100 for a semitone, 1,200 for the octave. Each clock below shows the octave as a circle: the grey ticks are the twelve keys of a piano, the red dots the notes the scale keeps, labelled in cents, and they light up as they sound. The major scale keeps seven of the twelve; the harmonic minor lowers the third and the sixth, which gives it its darker colour.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"sc.players(d3, html, [\"major\", \"minor\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"Equal temperament is a compromise: every key sounds the same, at the price of slightly impure intervals. Renaissance theorists such as Gioseffo Zarlino tuned the scale on simple ratios of frequencies instead, 3/2 for the fifth and 5/4 for the major third: the thirds come out 14 cents lower than on a piano, and sound smoother when held in a chord.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"sc.players(d3, html, [\"just\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"## Five notes\n\nMany traditions build their music on five notes. The Chinese gong mode is obtained by stacking pure fifths, following the ancient method of adding and subtracting thirds of a pipe length. Japanese music has a pentatonic scale without semitones (yo) and one with two (in); the flutes and panpipes of the Andes play a minor form. And two scales half a world apart share the very same five notes: the Ryukyu scale of Okinawa and the Bati mode of Ethiopia.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"sc.players(d3, html, [\"gong\", \"yo\", \"in\", \"andes\", \"ryukyu\", \"bati\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"## Bent notes\n\nThe blues scale is a minor pentatonic with an added flattened fifth. Written down, it fits on a piano; but singers and guitarists bend the third, the fifth and the seventh between the keys: the blue notes reach for pitches that the piano lacks.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"sc.players(d3, html, [\"blues\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"## Between the keys\n\nArabic, Turkish and Persian music use intervals that do not exist on a piano. Maqam Rast places its third and seventh halfway between major and minor, at about 350 and 1,050 cents; Bayati starts with a step of three quarters of a tone. Theorists write these notes on a grid of 24 quarter tones, but musicians tune them by ear, and the exact intonation varies from Cairo to Aleppo or Baghdad. Maqam Hijaz, on the other hand, uses ordinary semitones: on paper it has the same notes as the Andalusian mode of flamenco and the freygish of klezmer music, three cousins around the Mediterranean.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"sc.players(d3, html, [\"rast\", \"bayati\", \"shur\", \"hijaz\", \"flamenco\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"## Over a drone\n\nIn Indian classical music a raga is more than a scale: it has characteristic phrases, different paths up and down, and a time of day. But its notes are always heard against a drone on the tonic and the fifth, played by the tanpura, and against this constant reference singers tune the intervals to simple ratios, as in just intonation. Yaman is sung in the evening, Bhairav at dawn.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"sc.players(d3, html, [\"yaman\", \"bhairav\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"## Equal, but not twelve\n\nEqual steps are not a Western invention, and twelve is not the only choice. Thai classical instruments divide the octave into seven roughly equal steps of about 171 cents, and so do many balafons in Mali and Guinea. Javanese slendro and the xylophones of the Buganda court, in Uganda, divide it into five steps of about 240 cents. Pelog, the other scale of the gamelan, has seven unequal steps, and each gamelan is tuned on its own.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"sc.players(d3, html, [\"thai\", \"balafon\", \"slendro\", \"amadinda\", \"pelog\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"$3c","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"Data: land from [Natural Earth](https://www.naturalearthdata.com/) via [world-atlas](https://github.com/topojson/world-atlas) · tunings compiled for this page from standard descriptions of each tradition.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"## Code","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"land = {\n const world = await d3.json(\"https://cdn.jsdelivr.net/npm/world-atlas@2.0.2/land-110m.json\");\n return topojson.feature(world, world.objects.land);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"// Navigation header of the series\nimport {nav} from \"@xoolive/30-day-map-challenge-2026-day-1-points\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"$3d","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"// the Winkel tripel projection, from d3-geo-projection\ngeoWinkel3 = (await import(\"https://cdn.jsdelivr.net/npm/d3-geo-projection@4.0.0/+esm\")).geoWinkel3","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3e","stdlib":"2"}} 33:null