Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
(function () {
    'use strict';

    var ctx = null;
    var activeNodes = [];
    var activeBtn = null;
    var STORAGE_KEY = 'edoChordPlayTimbre';
    var TIMBRES = ['triangle', 'sawtooth', 'square', 'sine'];
    var TIMBRE_LABELS = { triangle: 'Triangle', sawtooth: 'Sawtooth', square: 'Square', sine: 'Sine' };

    var timbre = (function () {
        try {
            var saved = localStorage.getItem(STORAGE_KEY);
            return TIMBRES.indexOf(saved) >= 0 ? saved : 'triangle';
        } catch (e) { return 'triangle'; }
    })();

    function setTimbre(t) {
        if (TIMBRES.indexOf(t) < 0) return;
        timbre = t;
        try { localStorage.setItem(STORAGE_KEY, t); } catch (e) {}
        // Keep every selector on the page in sync
        document.querySelectorAll('.edo-chord-timbre').forEach(function (sel) {
            sel.value = t;
        });
    }

    function getCtx() {
        if (!ctx) ctx = new (window.AudioContext || window.webkitAudioContext)();
        return ctx;
    }

    function stopAll() {
        if (!ctx) return;
        var now = ctx.currentTime;
        activeNodes.forEach(function (n) {
            try {
                n.gain.gain.cancelScheduledValues(now);
                n.gain.gain.setValueAtTime(n.gain.gain.value, now);
                n.gain.gain.exponentialRampToValueAtTime(0.0001, now + 0.05);
                n.osc.stop(now + 0.06);
            } catch (e) {}
        });
        activeNodes = [];
        if (activeBtn) { activeBtn.classList.remove('playing'); activeBtn = null; }
    }

    function playChord(centsArr, btn) {
        stopAll();
        var c = getCtx();
        if (c.state === 'suspended') c.resume();
        var now = c.currentTime;
        var base = 261.63;
        var attack = 0.02, sustain = 2.5, release = 1.5;
        var totalDur = attack + sustain + release;
        var peak = 0.18 / Math.sqrt(centsArr.length);

        centsArr.forEach(function (cents) {
            var osc = c.createOscillator();
            var gain = c.createGain();
            osc.type = timbre;
            osc.frequency.value = base * Math.pow(2, cents / 1200);
            gain.gain.setValueAtTime(0, now);
            gain.gain.linearRampToValueAtTime(peak, now + attack);
            gain.gain.setValueAtTime(peak, now + attack + sustain);
            gain.gain.exponentialRampToValueAtTime(0.0001, now + totalDur);
            osc.connect(gain).connect(c.destination);
            osc.start(now);
            osc.stop(now + totalDur + 0.1);
            activeNodes.push({ osc: osc, gain: gain });
        });

        if (btn) {
            btn.classList.add('playing');
            activeBtn = btn;
            setTimeout(function () {
                if (activeBtn === btn) { btn.classList.remove('playing'); activeBtn = null; }
            }, totalDur * 1000);
        }
    }

    function injectSelectors() {
        var tables = new Set();
        document.querySelectorAll('.edo-chord-play').forEach(function (btn) {
            var table = btn.closest('table');
            if (table) tables.add(table);
        });
        tables.forEach(function (table) {
            var firstTh = table.querySelector('th');
            if (!firstTh || firstTh.querySelector('.edo-chord-timbre')) return;
            var sel = document.createElement('select');
            sel.className = 'edo-chord-timbre';
            sel.title = 'Synth timbre';
            TIMBRES.forEach(function (t) {
                var opt = document.createElement('option');
                opt.value = t;
                opt.textContent = TIMBRE_LABELS[t];
                if (t === timbre) opt.selected = true;
                sel.appendChild(opt);
            });
            sel.addEventListener('change', function () { setTimbre(sel.value); });
            sel.addEventListener('click', function (e) { e.stopPropagation(); });
            firstTh.innerHTML = '';
            firstTh.appendChild(sel);
        });
    }

    function handle(e) {
        var btn = e.target.closest && e.target.closest('.edo-chord-play');
        if (!btn) return;
        e.preventDefault();
        if (btn === activeBtn) { stopAll(); return; }
        var edo = parseInt(btn.dataset.edo, 10);
        var steps = (btn.dataset.steps || '').split(',').map(Number);
        if (!edo || !steps.length) return;
        var stepSize = 1200 / edo;
        playChord(steps.map(function (s) { return s * stepSize; }), btn);
    }

    document.addEventListener('click', handle);
    document.addEventListener('keydown', function (e) {
        if ((e.key === 'Enter' || e.key === ' ') && e.target.classList && e.target.classList.contains('edo-chord-play')) {
            handle(e);
        }
    });

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', injectSelectors);
    } else {
        injectSelectors();
    }
}());