import Tone from 'tone' import WebMidi from 'webmidi' import Nexus from 'nexusui' import keys from './lib/keys' import kalimba from './lib/kalimba' import scales from './lib/scales' import { mod, browser, requestAudioContext, ftom, mtof, tap } from './lib/util' import * as data from './data' const DEFAULT_BPM = 60 const nx = window.nx = {} let midi const note_values = [ [8, '8 measures'], [4, '4 measures'], [2, '2 measures'], [1, 'whole note'], [1/2, 'half note'], [1/3, 'third note'], [1/4, 'quarter note'], [1/5, 'fifth note'], [1/6, 'sixth note'], [1/8, 'eighth note'], [1/10, 'tenth note'], [1/12, 'twelfth note'], [1/16, 'sixteenth note'], [1/32, 'thirtysecond note'], ] WebMidi.enable(midi_ready) function midi_ready(err) { if (err) { console.error('webmidi failed to initialize') return } if (!WebMidi.outputs.length) { console.error('no MIDI output found') return } console.log(WebMidi.inputs) console.log(WebMidi.outputs) if (WebMidi.outputs.length > 1) { const filtered = WebMidi.outputs.filter(output => output.name.match(/prodipe/i)) if (filtered.length) { midi = filtered[0] } } midi = midi || WebMidi.outputs[0] console.log(midi.name) } let i = 0, datasets = {}, dataset = {}, bounds = {}, diff = [] let play_fn = play_sequence data.load().then(lists => { // nx.dataset.choices = Object.keys(lists) console.log(lists) datasets = lists requestAudioContext(ready) pick_dataset('housing costs and income inequality') }) function pick_dataset(key){ console.log('pick dataset:', key) i = 0 dataset = datasets[key] bounds = get_bounds(dataset) diff = get_diff_bounds(bounds.rows) } var behaviors = { sequence: { name: 'Sequence', fn: play_sequence }, interval: { name: 'Intervals', fn: play_interval_sequence }, } function pick_behavior(name){ behaviors[name].fn() } function play_next(){ let note_time = 120000 / Tone.Transport.bpm.value * note_values[nx.timing.active][0] setTimeout(play_next, note_time) play_fn(note_time) } function play_sequence(){ play_fn = (note_time) => { const { rows, min, max } = bounds const count = rows.length * rows[0].length if (i >= count) i = 0 const y = Math.floor(i / rows[0].length) const x = i % rows[0].length if (!x) console.log(y) const n = rows[y][x] i += 1 if (i >= count) i = 0; play( norm(n, min, max) * nx.multiply.value, note_time * nx.duration.value) } } function play_interval_sequence(){ play_fn = (note_time) => { const { rows, min, max } = bounds const count = rows.length if (i >= count) i = 0 const y = i % count const row = rows[y] if (! row) { i = 0; return } const row_min = Math.min.apply(Math, row) const row_max = Math.max.apply(Math, row) const row_f0 = norm(row_min, min, max) const row_root = row_f0 * nx.multiply.value row.forEach(n => { const note = row_root + norm(n - row_min, diff.min, diff.max) * nx.interval.value play(note, note_time * nx.duration.value) }) i += 1 } } function norm(n, min, max){ return (n - min) / (max - min) } function get_diff_bounds(rows){ const diffs = rows.map(row => { const row_min = Math.min.apply(Math, row) const row_max = Math.max.apply(Math, row) return row_max - row_min }) const min = Math.min.apply(Math, diffs) const max = Math.max.apply(Math, diffs) return { min, max } } function get_bounds(dataset){ let rows = dataset.lines rows.forEach(row => row.shift()) rows = rows.map(a => a.map(n => parseFloat(n))) const max = rows.reduce((a,b) => { return b.reduce((z,bb) => { return Math.max(z, bb) }, a) }, -Infinity) const min = rows.reduce((a,b) => { return b.reduce((z,bb) => { return Math.min(z, bb) }, a) }, Infinity) return { rows, max, min } } function play(index, duration){ // console.log(index) const scale = scales.current() const freq = scale.index(index + Math.round(nx.offset.value), nx.octave.value) let midi_note = ftom(freq) let cents = midi_note % 1 if (cents > 0.5) { midi_note += 1 cents -= 1 } cents *= 2 midi_note = Math.floor(midi_note) if (midi) { if (midi_note > 127) return const note = Tone.Frequency(Math.floor(midi_note), "midi").toNote() duration = duration || 60000 / Tone.Transport.bpm.value midi.playNote(note, "all", { duration }) // cents // midi.sendPitchBend(cents, "all") } else { kalimba.play(freq) } } function update_value_on_change(el, id, is_int, fn) { const label = document.querySelector(id + ' + .val') const update = v => { label.innerHTML = is_int ? parseInt(v) : v.toFixed(2) fn && fn(v) } el.on('change', update) update(el.value) el.update = update } function update_radio_value_on_change(el, id, values, fn) { let old_v = el.active const label = document.querySelector(id + ' + .val') const update = v => { if (v === -1) { v = el.active = old_v } else { old_v = v } label.innerHTML = values[v][1] fn && fn(v) } el.on('change', update) update(el.active) el.update = update } function build_options(el, lists, fn) { Object.keys(lists).forEach( (key, i) => { const list = lists[key] const option = document.createElement('option') option.innerHTML = list.name option.value = key el.appendChild(option) }) el.addEventListener('input', function(e){ fn(e.target.value) }) } function ready () { scales.build_options(document.querySelector('#scale')) build_options(document.querySelector('#dataset'), datasets, pick_dataset) build_options(document.querySelector('#behavior'), behaviors, pick_behavior) // nx.colorize('#f4d142') Tone.Transport.bpm.value = DEFAULT_BPM nx.tempo = new Nexus.Dial('#tempo', { min: 10, max: 300, step: 1, value: DEFAULT_BPM, }) update_value_on_change(nx.tempo, '#tempo', true, v => Tone.Transport.bpm.value = v) nx.timing = new Nexus.RadioButton('#timing', { size: [400,25], numberOfButtons: note_values.length, active: 6, }) update_radio_value_on_change(nx.timing, '#timing', note_values) nx.duration = new Nexus.Dial('#duration', { min: 0, max: 2, step: 0.01, value: 0.8, }) update_value_on_change(nx.duration, '#duration', false) nx.offset = new Nexus.Dial('#offset', { min: -24, max: 24, step: 1, value: 0, }) update_value_on_change(nx.offset, '#offset', true) nx.octave = new Nexus.Dial('#octave', { min: -4, max: 4, step: 1, value: 0, }) update_value_on_change(nx.octave, '#octave', true) nx.multiply = new Nexus.Dial('#multiply', { min: -64, max: 64, step: 1, value: 7, }) update_value_on_change(nx.multiply, '#multiply', true) nx.interval = new Nexus.Dial('#interval', { min: -64, max: 64, step: 1, value: 10, }) update_value_on_change(nx.interval, '#interval', true) document.querySelector('.loading').classList.remove('loading') play_next() } keys.listen(index => { nx.offset.value = index nx.offset.update(index) })