From 5acec7e46125171eac2bc338cd264a108ee432a2 Mon Sep 17 00:00:00 2001 From: ergz Date: Sun, 1 Oct 2023 01:57:09 -0700 Subject: [PATCH] wip - start working on octave selection choice --- README.md | 5 +++-- basic.html | 44 +++++++++++++++++++++++++++++++++++--------- basic.js | 12 ++++++++++-- 3 files changed, 48 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index 0148068..6748f45 100644 --- a/README.md +++ b/README.md @@ -9,5 +9,6 @@ that Fabilter's Synth One has: ## Basic Features - [x] Waveform -- [ ] Pitch -- [ ] Noise \ No newline at end of file +- [ ] Octave Selector +- [ ] Noise +- [ ] Keyboard \ No newline at end of file diff --git a/basic.html b/basic.html index 441d4d7..953eaa1 100644 --- a/basic.html +++ b/basic.html @@ -9,16 +9,42 @@
- - - - - - - - - +
+ Waveform Selection + + + + + + + + + +
+ +
+
+ Octave Selection + + + + + + + + + + + + + + + +
+
+ +
diff --git a/basic.js b/basic.js index f5e796d..1c1ca62 100644 --- a/basic.js +++ b/basic.js @@ -2,6 +2,11 @@ let osc = null; let gain = null; let selectedWave; +function octavehz(hz, octave) { + const val = parseFloat(octave); + return hz * 2 ** val; +} + window.onload = function () { const audioContext = new AudioContext(); // this gets the node for the start butten and adds to it an even listener for click, when clicked the synth will play @@ -23,12 +28,15 @@ window.onload = function () { gainDisplay.textContent = level; }); - function handleSelectionChange() { + function handleWaveformSelectionChange() { let selectedRadioButton = document.querySelector( "input[name='wavechoice']:checked" ); if (selectedRadioButton) { selectedWave = selectedRadioButton.value; + if (osc) { + osc.type = selectedWave; + } console.log(selectedWave); } else { console.log("No radio button is selected."); @@ -38,7 +46,7 @@ window.onload = function () { document .querySelectorAll("input[name='wavechoice']") .forEach((radioButton) => { - radioButton.addEventListener("change", handleSelectionChange); + radioButton.addEventListener("change", handleWaveformSelectionChange); }); document.getElementById("start").addEventListener("click", () => {