UI about pitch.js HOT 11 CLOSED

Nope, you didn't miss anything, except that it could have some analog flavor to it as well, but that's your call. ;)

Answers:

• Decimals, from -1.0 to 1.0
• Yes, decibels, as -Infinity to 0.0 where anything above zero is clipping.
• Hmm, probably C#3, Bb2, etc.

from pitch.js.

OK, assuming the numbers after the note names are the octaves on a standard piano?

from pitch.js.

Yes, according to the MIDI numbering scheme: {A0: 27.5Hz, A4: 440Hz}

from pitch.js.

Alright, so this isn't totally done yet, but I thought I'd show a work in progress and get some feedback. Here's what I've got so far:

Obviously I'm still working on finding a place to put what octave of the note is being played as well as the volume here, but as you can see, the general idea is that the wheel of notes rotates so that the note being played is pointed at by the green arrow. When the note isn't in tune the arrow will look grayish instead of green and either the sharp or flat sign will light up in red to highlight which direction it is off in, and the difference from the actual pitch is shown by the rotation of the wheel (the arrow will point between notes). Obviously the actual frequency will be displayed in the digital screen at the bottom. The "pitch.js" text will probably not be there. :)

Questions:

1. Of course this has to be integrated into the rest of a page. What were you envisioning that would look like? Kinda like the codecs pages?
2. Where should the volume meter go?
3. Where should the octave be represented? Should it be represented, or is the frequency enough? I kinda think it should...

Let me know what you think!

from pitch.js.

Alternatively, here's a version with a crack at showing the octave. I think volume isn't actually really necessary or that useful to show here, but octave is for most people who don't know the frequencies off hand. :)

Might be a little crowded... Thoughts?

from pitch.js.

Actually, if the UI is going to be like that, it's probably simplest if the only input it takes is the frequency. The rest are pretty easily derived from that, let's assume the note wheel's angle is in radians and at zero, it's C:

function getNote (frequency, reference) {
    if (!frequency) return null;

    reference = reference || 440;

    return 69 + 12 * Math.log(frequency / reference) / Math.LN2;
}

function getAngle (midiNote) {
    return midiTone ? Math.PI * (midiNote % 12) / 6 : 0;
}

function getOctave (midiNote) {
    return ~~(midiNote / 12);
}

from pitch.js.

Widget mockup:

from pitch.js.

A repo for the demo.

To curious outsiders: don't worry, the repo will become open as soon as we release the Kraken!

from pitch.js.

404'ing for me too... Should we just put the UI in a folder on this repo?

from pitch.js.

The permissions should be fixed now!

from pitch.js.

OK, awesome. Pushed. Closing this issue now. Resume tracking on that repo.

from pitch.js.