A library that allows to add footnotes to a web page

Question

I would like to add in my web app ability to add comments to a specific word in the page. Something like the LaTex footnotes.

The UI I had in mind is, each word would be highlighted when the mouse hovers over it (or that the space after it is being highlighted), and when the user clicks, a textbox to enter the comment pops up near the place the comment would appear. After the user entered the comment a little number would appear after this word in the web page, and other users would be able to click on this number and reveal the comment.

The architecture I had in mind is, a client side javascript program that would handle the view. The model and the controller would be on the server. They would save the document in some textile-like format (say, StackOverflow's question's format), and would only verify permissions (ie users would only be allowed to add [1] (user-name) ... to the document body ).

That's the architecture and UI I had in mind, but I'm open to new suggestions.

Is there any similar component availible?

Answer 1

The best thing I found so is the digress plugin for wordpress which allows paragraph-based comments.

Answer 2

I have been developing one with similar features. I use jQuery as the main framework and build on it. 1.select text to add some footnote to it. 2.click on the bubble to show dialog for enter your comments. 3.text with comments highlighted. Mouse hover over to bring up the dialog window with comments entered earlier, hover out to close dialog window. (pics here) It is not perfect now and I am trying to make it a plugin(javascript code) with JSP(maybe. it's coldfusion now.)