converting some html elements for ts compatibility

built/src/harmonyUtil.js

@@ -11,9 +11,9 @@ const intervals = {
     // all intervals beyond this invert to one of the previous intervals
 };
 // helper functions
-const transposePitches = (pitchNames, interval) => {
+const transposePitches = (pitches, interval) => {
     let transposed = [];
-    pitchNames.forEach(pitch => transposed.push((pitch + interval) % 12));
+    pitches.forEach(pitch => transposed.push((pitch + interval) % 12));
     return transposed;
 };
 const findVector = (pitches) => {

built/src/inputHandling.js

@@ -19,31 +19,39 @@ const bassLFOTarget = document.getElementById('bass-lfo-target');
 // logic for displaying values on HTML labels
 // S
 sopranoVol.oninput = (e) => {
-    sopranoVolTarget.innerHTML = e.target.value;
+    const target = e.target;
+    sopranoVolTarget.innerHTML = target.value;
 };
 sopLFO.oninput = (e) => {
-    sopLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target;
+    sopLFOTarget.innerHTML = ` ${target.value} Hz.`;
 };
 // A
 altoVol.oninput = (e) => {
-    altoVolTarget.innerHTML = e.target.value;
+    const target = e.target;
+    altoVolTarget.innerHTML = target.value;
 };
 altoLFO.oninput = (e) => {
-    altoLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target;
+    altoLFOTarget.innerHTML = ` ${target.value} Hz.`;
 };
 // T
 tenVol.oninput = (e) => {
-    tenVolTarget.innerHTML = e.target.value;
+    const target = e.target;
+    tenVolTarget.innerHTML = target.value;
 };
 tenLFO.oninput = (e) => {
-    tenLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target;
+    tenLFOTarget.innerHTML = ` ${target.value} Hz.`;
 };
 // B
 bassVol.oninput = (e) => {
-    bassVolTarget.innerHTML = e.target.value;
+    const target = e.target;
+    bassVolTarget.innerHTML = target.value;
 };
 bassLFO.oninput = (e) => {
-    bassLFOTarget.innerHTML = ` ${e.target.value.toString()} Hz.`;
+    const target = e.target;
+    bassLFOTarget.innerHTML = ` ${target.value} Hz.`;
 };
 // audio-adjacent input handling
 const synthButton = document.getElementById('synth-button');

index.html

@@ -118,9 +118,9 @@
         <!-- Tone.js library -->
         <script type="module" src="https://unpkg.com/tone@14.7.77/build/Tone.js"></script>
         <!-- internal scripts -->
-        <script type="module" src="./src/inputHandling.js"></script>
+        <script type="module" src="./built/src/inputHandling.js"></script>
-        <script type="module" src="./src/toneGeneration.js"></script>
+        <script type="module" src="./built/src/toneGeneration.js"></script>
-        <script type="module" src="./src/styleUtils.js"></script>
+        <script type="module" src="./built/src/styleUtils.js"></script>
         <script type="module" src="app.js"></script>
     </body>
 </html>

src/inputHandling.ts

@@ -24,38 +24,46 @@ const bassLFOTarget = document.getElementById('bass-lfo-target');
 // logic for displaying values on HTML labels
 // S
 sopranoVol.oninput = (e) => {
-    sopranoVolTarget.innerHTML = e.target.value;
+    const target = e.target as HTMLInputElement;
+    sopranoVolTarget.innerHTML = target.value;
 }
 
 sopLFO.oninput = (e) => {
-    sopLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target as HTMLInputElement;
+    sopLFOTarget.innerHTML = ` ${target.value} Hz.`;
 }
 
 // A
 altoVol.oninput = (e) => {
-    altoVolTarget.innerHTML = e.target.value;
+    const target = e.target as HTMLInputElement;
+    altoVolTarget.innerHTML = target.value;
 }
 
 altoLFO.oninput = (e) => {
-    altoLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target as HTMLInputElement;
+    altoLFOTarget.innerHTML = ` ${target.value} Hz.`;
 }
 
 // T
 tenVol.oninput = (e) => {
-    tenVolTarget.innerHTML = e.target.value;
+    const target = e.target as HTMLInputElement;
+    tenVolTarget.innerHTML = target.value;
 }
 
 tenLFO.oninput = (e) => {
-    tenLFOTarget.innerHTML = ` ${e.target.value} Hz.`;
+    const target = e.target as HTMLInputElement;
+    tenLFOTarget.innerHTML = ` ${target.value} Hz.`;
 }
 
 // B
 bassVol.oninput = (e) => {
-    bassVolTarget.innerHTML = e.target.value;
+    const target = e.target as HTMLInputElement;
+    bassVolTarget.innerHTML = target.value;
 }
 
 bassLFO.oninput = (e) => {
-    bassLFOTarget.innerHTML = ` ${e.target.value.toString()} Hz.`;
+    const target = e.target as HTMLInputElement;
+    bassLFOTarget.innerHTML = ` ${target.value} Hz.`;
 }
 
 // audio-adjacent input handling