add getFrequencyFromNoteName(noteFullName)

- fix steps range input

Author: J43fura

demo/src/components/PlayNote.vue

@@ -73,7 +73,7 @@
           <br />
           <input
             type="range"
-            v-model="steps"
+            v-model.number="steps"
             :id="steps_text"
             :min="MIN_STEPS"
             :max="MAX_STEPS"
@@ -196,7 +196,7 @@ function updateLowestMetrics() {
   lowest_metrics.value = np.getLowestMetrics()
 }
 const MIN_FREQEUNCY = computed(() => lowest_metrics.value.frequency)
-const MIN_STEPS = computed(() => lowest_metrics.value.steps)
+const MIN_STEPS = computed(() => lowest_metrics.value.step)
 const MAX_FREQEUNCY = 20000
 const MAX_STEPS = np.getStepsFromFrequency(MAX_FREQEUNCY)
 
@@ -211,9 +211,12 @@ watch(temperament, () => {
 
 const note_name_text = 'Note name'
 const note_name = ref('A4')
+watch(note_name, () => {
+  note_frequency.value = np.getFrequencyFromNoteName(note_name.value)
+})
 
 const steps_text = 'Steps'
-const steps = ref(0)
+const steps = ref<number>(0)
 watch(steps, () => {
   note_frequency.value = np.getFrenquencyFromSteps(steps.value)
   note_name.value = np.getNoteNameFromSteps(steps.value)

dist/index.d.ts

@@ -8,6 +8,7 @@ declare class notePlayer {
     private CONCERT_PITCH_OCTAVE;
     private temperament;
     private noteNames;
+    private noteNameRegex;
     constructor();
     setOscillatorDefaultSettings(): void;
     setOscillatorType(type: OscillatorType): void;
@@ -20,10 +21,13 @@ declare class notePlayer {
     getFrenquencyFromSteps(steps: number): number;
     getStepsFromFrequency(frequency: number): number;
     getNoteNameFromSteps(steps: number): string;
+    getLowestStep(): number;
+    getLowestFrequency(): number;
     getLowestMetrics(): {
-        steps: number;
+        step: number;
         frequency: number;
     };
+    getFrequencyFromNoteName(noteFullName: string): number;
 }
 
 export { notePlayer as default };

dist/index.js

@@ -25,6 +25,7 @@ var notePlayer = class {
     "G#"
   ];
   // Based on Chromatic scale (12-TET) only, TODO: auto detect notes based on temperament
+  noteNameRegex = /^(A|B|C|D|E|F|G)(#?)(\d)$/;
   constructor() {
     this.audioCtx = new AudioContext();
     this.gainNode = this.audioCtx.createGain();
@@ -80,10 +81,37 @@ var notePlayer = class {
     let noteIndex = (steps >= 0 ? steps : Math.abs(this.noteNames.length + steps)) % this.temperament;
     return `${this.noteNames[noteIndex]}${octave}`;
   }
+  getLowestStep() {
+    const step = -this.temperament * this.CONCERT_PITCH_OCTAVE;
+    return step;
+  }
+  getLowestFrequency() {
+    const step = this.getLowestStep();
+    const frequency = this.getFrenquencyFromSteps(step);
+    return frequency;
+  }
   getLowestMetrics() {
-    const steps = -this.temperament * this.CONCERT_PITCH_OCTAVE;
+    return { step: this.getLowestStep(), frequency: this.getLowestFrequency() };
+  }
+  getFrequencyFromNoteName(noteFullName) {
+    console.log("Incoming noteFullName:", noteFullName);
+    const match = noteFullName.match(this.noteNameRegex);
+    console.log(noteFullName, match);
+    if (!match) {
+      throw new Error("Invalid note format");
+    }
+    const [, noteLetter, sharp, octaveStr] = match;
+    const noteName = `${noteLetter}${sharp}`;
+    const octave = Number(octaveStr);
+    const noteIndex = this.noteNames.findIndex((note) => note === noteName);
+    if (noteIndex === -1) {
+      throw new Error("Invalid note");
+    }
+    const stepsFromOctave = this.temperament * octave;
+    const stepsBase = noteIndex;
+    const steps = this.getLowestStep() + stepsFromOctave + stepsBase;
     const frequency = this.getFrenquencyFromSteps(steps);
-    return { steps, frequency };
+    return frequency;
   }
 };
 export {

src/index.ts

@@ -21,6 +21,7 @@ export default class notePlayer {
     "G",
     "G#",
   ]; // Based on Chromatic scale (12-TET) only, TODO: auto detect notes based on temperament
+  private noteNameRegex = /^(A|B|C|D|E|F|G)(#?)(\d)$/;
 
   constructor() {
     this.audioCtx = new AudioContext();
@@ -90,9 +91,42 @@ export default class notePlayer {
     return `${this.noteNames[noteIndex]}${octave}`;
   }
 
+  getLowestStep() {
+    const step = -this.temperament * this.CONCERT_PITCH_OCTAVE;
+    return step;
+  }
+  getLowestFrequency() {
+    const step = this.getLowestStep();
+    const frequency = this.getFrenquencyFromSteps(step);
+    return frequency;
+  }
   getLowestMetrics() {
-    const steps = -this.temperament * this.CONCERT_PITCH_OCTAVE;
+    return { step: this.getLowestStep(), frequency: this.getLowestFrequency() };
+  }
+
+  getFrequencyFromNoteName(noteFullName: string) {
+    console.log("Incoming noteFullName:", noteFullName);
+
+    const match = noteFullName.match(this.noteNameRegex);
+    console.log(noteFullName, match);
+    if (!match) {
+      throw new Error("Invalid note format");
+    }
+
+    const [, noteLetter, sharp, octaveStr] = match;
+
+    const noteName = `${noteLetter}${sharp}`;
+    const octave = Number(octaveStr);
+
+    const noteIndex = this.noteNames.findIndex((note) => note === noteName);
+
+    if (noteIndex === -1) {
+      throw new Error("Invalid note");
+    }
+    const stepsFromOctave = this.temperament * octave;
+    const stepsBase = noteIndex;
+    const steps = this.getLowestStep() + stepsFromOctave + stepsBase;
     const frequency = this.getFrenquencyFromSteps(steps);
-    return { steps, frequency };
+    return frequency;
   }
 }