User:Pailiaq/common.js - Revision history

Pailiaq at 07:11, 26 May 2026

2026-05-26T07:11:54Z

← Older revision		Revision as of 07:11, 26 May 2026
Line 8:		Line 8:
	var TIMBRES = ['triangle', 'sawtooth', 'square', 'sine'];		var TIMBRES = ['triangle', 'sawtooth', 'square', 'sine'];
	var TIMBRE_LABELS = { triangle: 'Triangle', sawtooth: 'Sawtooth', square: 'Square', sine: 'Sine' };		var TIMBRE_LABELS = { triangle: 'Triangle', sawtooth: 'Sawtooth', square: 'Square', sine: 'Sine' };
	var LOOK_AHEAD = 0.05; // 50ms buffer so the audio thread can schedule		var LOOK_AHEAD = 0.00; // 50ms buffer so the audio thread can schedule
	var BASE_FREQ = 261.63; // middle C; pitch is set via detune (cents) on top		var BASE_FREQ = 261.63; // middle C; pitch is set via detune (cents) on top

Pailiaq at 07:09, 26 May 2026

2026-05-26T07:09:44Z

← Older revision		Revision as of 07:09, 26 May 2026
Line 8:		Line 8:
	var TIMBRES = ['triangle', 'sawtooth', 'square', 'sine'];		var TIMBRES = ['triangle', 'sawtooth', 'square', 'sine'];
	var TIMBRE_LABELS = { triangle: 'Triangle', sawtooth: 'Sawtooth', square: 'Square', sine: 'Sine' };		var TIMBRE_LABELS = { triangle: 'Triangle', sawtooth: 'Sawtooth', square: 'Square', sine: 'Sine' };
			var LOOK_AHEAD = 0.05; // 50ms buffer so the audio thread can schedule
			var BASE_FREQ = 261.63; // middle C; pitch is set via detune (cents) on top

	var timbre = (function () {		var timbre = (function () {
Line 20:		Line 22:
	timbre = t;		timbre = t;
	try { localStorage.setItem(STORAGE_KEY, t); } catch (e) {}		try { localStorage.setItem(STORAGE_KEY, t); } catch (e) {}
	~~// Keep every selector on the page in sync~~
	document.querySelectorAll('.edo-chord-timbre').forEach(function (sel) {		document.querySelectorAll('.edo-chord-timbre').forEach(function (sel) {
	sel.value = t;		sel.value = t;
Line 29:		Line 30:
	if (!ctx) ctx = new (window.AudioContext \|\| window.webkitAudioContext)();		if (!ctx) ctx = new (window.AudioContext \|\| window.webkitAudioContext)();
	return ctx;		return ctx;
			}

			function disposeNode(node) {
			try { node.osc.disconnect(); } catch (e) {}
			try { node.gain.disconnect(); } catch (e) {}
			var idx = activeNodes.indexOf(node);
			if (idx >= 0) activeNodes.splice(idx, 1);
	}		}

	function stopAll() {		function stopAll() {
	if (!ctx) return;		if (!ctx) return;
	var now = ctx.currentTime;		var now = ctx.currentTime + LOOK_AHEAD;
	activeNodes.forEach(function (n) {		// Snapshot and clear before stopping, so onended handlers find no matches and just dispose
			var toStop = activeNodes;
			activeNodes = [];
			toStop.forEach(function (n) {
	try {		try {
	n.gain.gain.cancelScheduledValues(now);		n.gain.gain.cancelScheduledValues(now);
Line 42:		Line 53:
	} catch (e) {}		} catch (e) {}
	});		});
	~~activeNodes = [];~~
	if (activeBtn) { activeBtn.classList.remove('playing'); activeBtn = null; }		if (activeBtn) { activeBtn.classList.remove('playing'); activeBtn = null; }
	}		}
Line 50:		Line 60:
	var c = getCtx();		var c = getCtx();
	if (c.state === 'suspended') c.resume();		if (c.state === 'suspended') c.resume();
	var now = c.currentTime;		var now = c.currentTime + LOOK_AHEAD;
	~~var base = 261.63~~;
	var attack = 0.02, sustain = 0.2, release = 5;		var attack = 0.02, sustain = 0.2, release = 5;
	var totalDur = attack + sustain + release;		var totalDur = attack + sustain + release;
Line 60:		Line 69:
	var gain = c.createGain();		var gain = c.createGain();
	osc.type = timbre;		osc.type = timbre;
	osc.frequency.value = ~~base * Math~~.~~pow(2,~~ cents ~~/ 1200)~~;		osc.frequency.value = BASE_FREQ;
			osc.detune.value = cents;
	gain.gain.setValueAtTime(0, now);		gain.gain.setValueAtTime(0, now);
	gain.gain.linearRampToValueAtTime(peak, now + attack);		gain.gain.linearRampToValueAtTime(peak, now + attack);
Line 68:		Line 78:
	osc.start(now);		osc.start(now);
	osc.stop(now + totalDur + 0.1);		osc.stop(now + totalDur + 0.1);
	~~activeNodes.push(~~{ osc: osc, gain: gain });
			var node = { osc: osc, gain: gain };
			activeNodes.push(node);
			osc.onended = function () { disposeNode(node); };
	});		});

Line 106:		Line 119:
	}		}

	function handle(e) {		function handle(e) {
	var btn = e.target.closest && e.target.closest('.edo-chord-play');		var btn = e.target.closest && e.target.closest('.edo-chord-play');
	if (!btn) return;		if (!btn) return;
	e.preventDefault();		e.preventDefault();
	if (btn === activeBtn) { stopAll(); return; }		if (btn === activeBtn) { stopAll(); return; }

	var cents;		var cents;
	if (btn.dataset.cents) {		if (btn.dataset.cents) {
	~~// JI mode: raw cents passed directly~~		cents = btn.dataset.cents.split(',').map(Number);
	cents = btn.dataset.cents.split(',').map(Number);		} else {
	} else {		var edo = parseInt(btn.dataset.edo, 10);
	~~// EDO mode: compute cents from edo + steps~~		var steps = (btn.dataset.steps \|\| '').split(',').map(Number);
	var edo = parseInt(btn.dataset.edo, 10);		if (!edo \|\| !steps.length) return;
	var steps = (btn.dataset.steps \|\| '').split(',').map(Number);		var stepSize = 1200 / edo;
	if (!edo \|\| !steps.length) return;		cents = steps.map(function (s) { return s * stepSize; });
	var stepSize = 1200 / edo;		}
	cents = steps.map(function (s) { return s * stepSize; });		if (!cents.length \|\| cents.some(isNaN)) return;
	}		playChord(cents, btn);
	if (!cents.length \|\| cents.some(isNaN)) return;		}
	playChord(cents, btn);
	}

	document.addEventListener('click', handle);		document.addEventListener('click', handle);

Pailiaq at 02:24, 26 May 2026

2026-05-26T02:24:42Z

← Older revision		Revision as of 02:24, 26 May 2026
Line 106:		Line 106:
	}		}

	function handle(e) {		function handle(e) {
	var btn = e.target.closest && e.target.closest('.edo-chord-play');		var btn = e.target.closest && e.target.closest('.edo-chord-play');
	if (!btn) return;		if (!btn) return;
	e.preventDefault();		e.preventDefault();
	if (btn === activeBtn) { stopAll(); return; }		if (btn === activeBtn) { stopAll(); return; }
	var edo = parseInt(btn.dataset.edo, 10);
	var steps = (btn.dataset.steps \|\| '').split(',').map(Number);		var cents;
	if (!edo \|\| !steps.length) return;		if (btn.dataset.cents) {
	var stepSize = 1200 / edo;		// JI mode: raw cents passed directly
	~~playChord(~~steps.map(function (s) { return s * stepSize; }), btn);		cents = btn.dataset.cents.split(',').map(Number);
	}		} else {
			// EDO mode: compute cents from edo + steps
			var edo = parseInt(btn.dataset.edo, 10);
			var steps = (btn.dataset.steps \|\| '').split(',').map(Number);
			if (!edo \|\| !steps.length) return;
			var stepSize = 1200 / edo;
			cents = steps.map(function (s) { return s * stepSize; });
			}
			if (!cents.length \|\| cents.some(isNaN)) return;
			playChord(cents, btn);
			}

	document.addEventListener('click', handle);		document.addEventListener('click', handle);

Pailiaq: Undo revision 230983 by Pailiaq (talk)

2026-05-26T02:15:15Z

Undo revision 230983 by Pailiaq (talk)

Show changes

Pailiaq at 02:14, 26 May 2026

2026-05-26T02:14:02Z

Show changes

Pailiaq at 01:53, 26 May 2026

2026-05-26T01:53:27Z

← Older revision		Revision as of 01:53, 26 May 2026
Line 52:		Line 52:
	var now = c.currentTime;		var now = c.currentTime;
	var base = 261.63;		var base = 261.63;
	var attack = 0.02, sustain = 2.5, release = 1.5;		var attack = 0.02, sustain = 0.2, release = 5;
	var totalDur = attack + sustain + release;		var totalDur = attack + sustain + release;
	var peak = 0.18 / Math.sqrt(centsArr.length);		var peak = 0.18 / Math.sqrt(centsArr.length);

Pailiaq at 01:52, 26 May 2026

2026-05-26T01:52:04Z

@@ Line 5: / Line 5: @@
      var activeNodes = [];
      var activeBtn = null;
      function getCtx() {
@@ Line 31: / Line 51: @@
          if (c.state === 'suspended') c.resume();
          var now = c.currentTime;
-         var base = 261.63;                  // middle C
+         var base = 261.63;
-         var attack = 0.1, sustain = 0.15, release = 4;
+         var attack = 0.02, sustain = 2.5, release = 1.5;
          var totalDur = attack + sustain + release;
          var peak = 0.18 / Math.sqrt(centsArr.length);
@@ Line 39: / Line 59: @@
              var osc = c.createOscillator();
              var gain = c.createGain();
-             osc.type = 'triangle';
+             osc.type = timbre;
              osc.frequency.value = base * Math.pow(2, cents / 1200);
              gain.gain.setValueAtTime(0, now);
@@ Line 58: / Line 78: @@
              }, totalDur * 1000);
+         }
+     }
@@ Line 64: / Line 110: @@
          if (!btn) return;
          e.preventDefault();
-         if (btn === activeBtn) { stopAll(); return; }   // click again to stop
+         if (btn === activeBtn) { stopAll(); return; }
          var edo = parseInt(btn.dataset.edo, 10);
          var steps = (btn.dataset.steps || '').split(',').map(Number);
@@ Line 78: / Line 124: @@
+         }
      });
 }());

Pailiaq at 01:40, 26 May 2026

2026-05-26T01:40:06Z

← Older revision		Revision as of 01:40, 26 May 2026
Line 32:		Line 32:
	var now = c.currentTime;		var now = c.currentTime;
	var base = 261.63; // middle C		var base = 261.63; // middle C
	var attack = 0.02, sustain = 0.05, release = ~~2.5~~;		var attack = 0.1, sustain = 0.15, release = 4;
	var totalDur = attack + sustain + release;		var totalDur = attack + sustain + release;
	var peak = 0.18 / Math.sqrt(centsArr.length);		var peak = 0.18 / Math.sqrt(centsArr.length);

Pailiaq at 01:38, 26 May 2026

2026-05-26T01:38:48Z

← Older revision		Revision as of 01:38, 26 May 2026
Line 32:		Line 32:
	var now = c.currentTime;		var now = c.currentTime;
	var base = 261.63; // middle C		var base = 261.63; // middle C
	var attack = 0.02, sustain = 0.3, release = 2.5;		var attack = 0.02, sustain = 0.05, release = 2.5;
	var totalDur = attack + sustain + release;		var totalDur = attack + sustain + release;
	var peak = 0.18 / Math.sqrt(centsArr.length);		var peak = 0.18 / Math.sqrt(centsArr.length);

Pailiaq at 01:38, 26 May 2026

2026-05-26T01:38:17Z

← Older revision		Revision as of 01:38, 26 May 2026
Line 32:		Line 32:
	var now = c.currentTime;		var now = c.currentTime;
	var base = 261.63; // middle C		var base = 261.63; // middle C
	var attack = 0.02, sustain = 2.5, release = 1.5;		var attack = 0.02, sustain = 0.3, release = 2.5;
	var totalDur = attack + sustain + release;		var totalDur = attack + sustain + release;
	var peak = 0.18 / Math.sqrt(centsArr.length);		var peak = 0.18 / Math.sqrt(centsArr.length);