ergz/simple-synth
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

was forgetting to connect the gain node to the destination

Browse Source
This commit is contained in:
Emanuel Rodriguez
2023-10-13 11:42:05 -07:00
parent 7bed2c6085
commit 2b5a0453d0
2 changed files with 192 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
index.html
View File

@@ -33,6 +33,12 @@
<button id="octaveup1" class="bg-gray-400 hover:bg-gray-500 text-gray-800 font-bold py-1 px-4">+</button>
</fieldset>
</div>
<div style="padding: 5px">
<label for="volumevoice1" class="block text-sm font-medium text-gray-700 mb-1">volume voice</label>
<input id="volumevoice1" type="range" min="0" max="1" value=".3" step=".05" class="slider bg-gray-300 h-2 rounded-full outline-none"/>
<span id="volumevoice1display" class="text-sm text-gray-700 ml-2">0</span>
</div>
<div style="padding: 5px">
<label for="detunevoice1" class="block text-sm font-medium text-gray-700 mb-1">detune voice</label>
@@ -40,12 +46,6 @@
<span id="detunevoice1display" class="text-sm text-gray-700 ml-2">0</span>
</div>
<!-- <div style="padding: 5px">
<label for="filtervoice1" class="block text-sm font-medium text-gray-700 mb-1">filter voice</label>
<input id="filtervoice1" type="range" min="700" max="1500" value="1000" step="1" class="slider bg-gray-300 h-2 rounded-full outline-none"/>
<span id="filtervoice1display" class="text-sm text-gray-700 ml-2">0</span>
</div> -->
<div class="flex-container flex-grow border-2 border-gray-800 rounded-md p-4 m-4">
<div id = "wave1viz" class="canvas-container">
<canvas id ="wave1canvas"></canvas>
@@ -77,6 +77,13 @@
<button id="octaveup2" class="bg-gray-400 hover:bg-gray-500 text-gray-800 font-bold py-1 px-4">+</button>
</fieldset>
</div>
<div style="padding: 5px">
<label for="volumevoice2" class="block text-sm font-medium text-gray-700 mb-1">volume voice</label>
<input id="volumevoice2" type="range" min="0" max="1" value=".3" step=".05" class="slider bg-gray-300 h-2 rounded-full outline-none"/>
<span id="volumevoice2display" class="text-sm text-gray-700 ml-2">0</span>
</div>
<div style="padding: 5px">
<label for="detunevoice2" class="block text-sm font-medium text-gray-700 mb-1">detune voice</label>
@@ -98,7 +105,7 @@
<div class="flex-grow border-2 border-gray-800 rounded-md p-4 m-4">
<form style="padding: 5px">
<legend>Voice 3</legend>
<legend class="text-lg mb-2">Voice 3</legend>
<input type="radio" id="wave3_sinwave" name="wavechoice3" value="sine" checked>
<label for="wave3_sinwave">Sine</label>
<input type="radio" id="wave3_squarewave" name="wavechoice3" value="square">
@@ -108,7 +115,7 @@
<input type="radio" id="wave3_sawtoothwave" name="wavechoice3" value="sawtooth">
<label for="wave3_sawtoothwave">Sawtooth</label>
</form>
<div style="padding: 5px">
<div class="flex items-center space-x-2 my-3">
<fieldset>
<legend>Octave Selection</legend>
<button id="octavedown3" class="bg-gray-400 hover:bg-gray-500 text-gray-800 font-bold py-1 px-4">-</button>
@@ -117,6 +124,13 @@
</fieldset>
</div>
<div style="padding: 5px">
<label for="volumevoice3" class="block text-sm font-medium text-gray-700 mb-1">volume voice</label>
<input id="volumevoice3" type="range" min="0" max="1" value=".3" step=".05" class="slider bg-gray-300 h-2 rounded-full outline-none"/>
<span id="volumevoice3display" class="text-sm text-gray-700 ml-2">0</span>
</div>
<div style="padding: 5px">
<label for="detunevoice3" class="block text-sm font-medium text-gray-700 mb-1">detune voice</label>
<input id="detunevoice3" type="range" min="-5" max="5" value="0" step=".1" class="slider bg-gray-300 h-2 rounded-full outline-none"/>
@@ -142,31 +156,61 @@
<div>
<form style="padding: 15px">
<fieldset>
<legend>Chords</legend>
<input type="radio" id="chordC" name="chordchoice" value="C" checked>
<label for="chordC">C</label>
<input type="radio" id="chordD" name="chordchoice" value="D">
<label for="chordD">D</label>
<input type="radio" id="chordE" name="chordchoice" value="E">
<label for="chordE">E</label>
<input type="radio" id="chordF" name="chordchoice" value="F">
<label for="chordF">F</label>
<input type="radio" id="chordG" name="chordchoice" value="G">
<label for="chordG">G</label>
<input type="radio" id="chordA" name="chordchoice" value="A">
<label for="chordA">A</label>
<input type="radio" id="chordB" name="chordchoice" value="B">
<label for="chordB">B</label>
</fieldset>
</form>
</div>
<legend>Chords</legend>
<!-- Major Chords -->
<div>
<input type="radio" id="chordC" name="chordchoice" value="C" checked>
<label for="chordC">C</label>
<input type="radio" id="chordD" name="chordchoice" value="D">
<label for="chordD">D</label>
<input type="radio" id="chordE" name="chordchoice" value="E">
<label for="chordE">E</label>
<input type="radio" id="chordF" name="chordchoice" value="F">
<label for="chordF">F</label>
<input type="radio" id="chordG" name="chordchoice" value="G">
<label for="chordG">G</label>
<input type="radio" id="chordA" name="chordchoice" value="A">
<label for="chordA">A</label>
<input type="radio" id="chordB" name="chordchoice" value="B">
<label for="chordB">B</label>
</div>
<div>
<!-- Minor Chords -->
<input type="radio" id="chordCm" name="chordchoice" value="Cm">
<label for="chordCm">Cm</label>
<input type="radio" id="chordDm" name="chordchoice" value="Dm">
<label for="chordDm">Dm</label>
<input type="radio" id="chordEm" name="chordchoice" value="Em">
<label for="chordEm">Em</label>
<input type="radio" id="chordFm" name="chordchoice" value="Fm">
<label for="chordFm">Fm</label>
<input type="radio" id="chordGm" name="chordchoice" value="Gm">
<label for="chordGm">Gm</label>
<input type="radio" id="chordAm" name="chordchoice" value="Am">
<label for="chordAm">Am</label>
<input type="radio" id="chordBm" name="chordchoice" value="Bm">
<label for="chordBm">Bm</label>
</div>
</fieldset>
</form>
</div>