Add wavelength

main
Charlotte Som 2023-03-06 02:50:24 +00:00
parent d3e17719c5
commit acc1e40a09
2 changed files with 15 additions and 7 deletions

View File

@ -32,7 +32,8 @@ const calculateNote = (root: number, frequency: number) => {
const semis = Math.round(distanceFromA);
const cents = Math.round((distanceFromA - semis) * 100);
let octave = 4 + Math.floor(semis / 12);
if (semis % 12 >= 3) octave += 1;
const octaveBoundSemis = ((semis % 12) + 12) % 12;
if (octaveBoundSemis >= 3) octave += 1;
const notes = [
"A",
"A#",
@ -47,7 +48,7 @@ const calculateNote = (root: number, frequency: number) => {
"G",
"G#",
];
const note = notes[semis % 12];
const note = notes[octaveBoundSemis];
let centsStr = "";
if (cents <= -1) {
@ -65,7 +66,7 @@ export default function Main() {
const [frequency, setFrequency] = useState("523.251");
const setRootValue: ChangeEventHandler<HTMLInputElement> = (e) => {
const newRoot = parseInt(e.target.value);
const newRoot = parseFloat(e.target.value);
if (!isNaN(newRoot)) setRoot(newRoot);
const frequency = calculateFrequency(newRoot, note);
if (frequency != null) setFrequency(frequency.toFixed(3));
@ -102,7 +103,7 @@ export default function Main() {
{"if A4 is "}
<input
type="text"
pattern="\d+"
pattern="\d+(\.\d+)"
value={root}
placeholder="440"
onChange={setRootValue}
@ -112,7 +113,6 @@ export default function Main() {
<section>
<input
type="text"
pattern=""
value={note}
placeholder="C5"
onChange={setNoteValue}
@ -120,12 +120,15 @@ export default function Main() {
{" is "}
<input
type="text"
pattern="\d+"
pattern="\d+(\.\d+)"
value={frequency}
placeholder="523.251"
onChange={setFrequencyValue}
/>
{" Hz"}
{" Hz "}
<aside>
(wavelength: {(1000 / parseFloat(frequency)).toFixed(4)} ms)
</aside>
</section>
</main>
</>

View File

@ -48,3 +48,8 @@ input[type="text"] {
input[type="text"]:focus {
border-color: rgb(141, 255, 208);
}
aside {
display: inline-block;
font-size: 0.8em;
}