use note names instead of frequencies

app.js

@@ -8,15 +8,17 @@ const maxInput = document.querySelector('#generate-tone input:nth-of-type(2)')
 const synth = new Tone.Synth().toDestination()
 
 let newTone
-let lowest = 27.5
-let highest = 4186
+let lowest = 'a0'
+let highest = 'c8'
 
 minInput.setAttribute('placeholder', lowest)
 maxInput.setAttribute('placeholder', highest)
 
 generateButton.addEventListener('click', () => {
 	Tone.start()
-	newTone = (Math.random() * (highest - lowest)) + lowest
+	const minFreq = teoria.note(lowest).fq()
+	const maxFreq = teoria.note(highest).fq()
+	newTone = (Math.random() * (maxFreq - minFreq)) + minFreq 
 	toneDisplay.innerHTML = newTone
 })
 
@@ -29,9 +31,9 @@ stopButton.addEventListener('click', ()=>{
 })
 
 minInput.addEventListener('change', ()=>{
-	lowest = parseFloat(minInput.value)
+	lowest = minInput.value
 })
 
 maxInput.addEventListener('change', ()=>{
-	highest = parseFloat(maxInput.value)
+	highest = maxInput.value
 })

index.html

@@ -4,6 +4,7 @@
 	<meta charset="UTF-8">
 	<title></title>
 	<script src="https://unpkg.com/tone"></script>
+	<script src="teoria.js"></script>
 	<script src="app.js" defer></script>
 	<script src="analyze.js" defer></script>
 </head>
@@ -15,8 +16,8 @@
 			<dt>Tone:</dt>
 			<dd></dd>
 		</dl>
-		<input type="number" />
-		<input type="number" />
+		<input type="text" />
+		<input type="text" />
 		<button>Generate Tone</button>
 		<button>Play</button>
 		<button>Stop</button>