I've been searching for years for a way to display musical chord symbols accurately via HTML. By chance I happened upon
ASCIIMathML.js
some time ago, and managed to come up with what I think is a passable implementation of Nashville notation.
Below is an example of what can be done. To see the markup used to display these chord symbols, use your browser to view the HTML source.
`C`
`C/E`
`dot F`
|`ddot (D^(m7))/G`
`G`
_________________________________________
`ddot 1`
|`dot ((1^o)/3^b)`
`1/3`
`ddot 4`
|`dot (1^(7b5))/4^#`
`5^+`
Now we need to find a human-writable markup that, paired with a script, can print MathML to the browser and is database-storable.
@ denotes a new line, either chords or lyrics.
~ starts a lyrics line. Use a colspan or just one column?
% starts a chord line.
& denotes a new measure.
Table rows and columns are automatically generated for us according to lines and measures.
Since we're requiring that lines and measures be explicitly defined, the user is allowed freeform entry using tabs, spaces or line breaks as he sees fit.
Retain parentheses and ^ for complex chords.
Automatically wrap each measure in backticks.
A ruleset that handles the font size increase --- e.g. defaults to <big><big>, and any measure containing / gets no size boost.
Make provisions for row containing CHORUS and similar divisions or comments.
Use a two-column layout scheme, lyrics on the left and chords on the right?, Or perhaps stacked layout, with lyrics in the top block and chords at the bottom? This can be selectable by the user as needed.
For those that cannot understand chord numbering systems, it should be trivial to convert between chord numbers (1-4-5) and names (E-A-B), programmatically.
To that end, I'm posting proof-of-concept code here, written in Perl.
Bear in mind that this is alpha code, and things will change. If you come up with chord charts yourself,
they will become unusable, and will require changes in order to work with later code.
In order for charts to be displayed correctly, you must use ASCIIMathML.js. Please note that I am not distributing this software, as I did not write it.
You can obtain ASCIIMathML.js from the author directly.