HN Explorer

19 comments

[ 3.8 ms ] story [ 48.5 ms ] thread
hsmyers
Given that all of the graphic elements needed exist as Unicode, and that there exists code to detect specific fonts on the viewers machine, I'd like to see them used as the default rather than the somewhat sketchy drawings as shown. Just a suggestion...
cgcardona
Great suggestion. I'll look into it. Thanks.
cgcardona
I just got home from lunch and have already implemented a new bass clef with unicode characters. This was an absolutely great idea! Thanks!!! :-D
Goladus
If I were going to start a project to map elements of a musical score to HTML5 custom attributes, I would probably start with something like Lilypond, which has a convenient formal specification:

http://lilypond.org/doc/v2.12/Documentation/user/lilypond/in...

cgcardona
Yes, someone else from the WHATWG mentioned lilypond. I intend to look into it. Thanks for the suggestion.
Goladus
No problem, and good luck. I started a number of music-language projects that rarely made much progress, usually because I got frustrated after recognizing my design had some fundamental flaw that made it particularly hard to express something important. In retrospect, if I had known about Lilypond I'd have started there.
cgcardona
Yes, I can see that checking out Lilypond is in my future. ;-]
owyn
Check out vextab/vexflow, no need to re-invent the wheel. It's a complete (and open source) framework for music/tab notation:

http://vextab.com/

cgcardona
I've not seen this before. Very cool! Thanks for bringing it to my attention.
redthrowaway
Quite cool, but having a "play" button seems like a must for a site like that.
cgcardona
Agreed 100%. play(), pause(), stop(), and a whole suite of functions are in the works. ;-]
tjarratt
Please post an update (or link to a blog post or something) when you do add this. It would be great to see that functionality working.
Bud
You forgot to account for the ledger line for middle C.
cgcardona
Initially I had the middle C line showing up all the time but that is incorrect and made the music had to read. My intention is to make the middle C ledger intelligent enough to only show up when a note is sitting directly on it.
JackWebbHeller
I can't get it to work - none of the examples in fact. I'm running Chrome Mac Dev Channel (v13.0.782.4). Clicking any of the buttons causes nothing to happen whatsoever.

One error is shown, when a button is DOUBLE-clicked (does not appear on single click), in the output console: "Error in event handler for 'undefined': Error: INDEX_SIZE_ERR: DOM Exception 1"

cgcardona
I've seen it work in FF4, Chrome 12, Opera 11.11, Safari 5, Android 2.2, iPad and iPod touch but I've not tested it in Chrome 13. I guess I should :-/

Thanks for the bug report. Much appreciated.

tjarratt
Hey @cgcardona, this is really cool, but the 'fork me on github' tag in the corner doesn't really work well on Webkit browsers.

With the latest chrome, you can't see "fork me on github" - only "cause i rock" backwards - this is a known bug with reverse css but is easy to work around.

In Safari v5, you can see 'fork me on github' but it disappears on mouseover.

Very cool demo though.

cgcardona
@tjarratt, Thanks! Yeah the corner github tag is looking pretty bad in FF also. I guess I need to redesign that.