new useful feature 'footnotes'

I'd like to add new useful feature 'footnotes'. This feature allows users to add automatically numbered footnotes within a text.
This feature was inspired by footnotes module.

Please review this patch.

Usage:
[fn]footnote text[/fn]
or
[footnote]footnote text[/footnote]

Use example:

BBCode is an abbreviation for Bulletin Board Code, the lightweight markup language[fn]A lightweight markup language is a markup language with a simple syntax, designed to be easy for a human to enter with a simple text editor, and easy to read in its raw form.[/fn] used to format posts in many message boards. It is also called forum codes. The available tags are usually indicated by rectangular brackets surrounding a keyword, and they are parsed by the message board system before being translated into a markup language that web browsers[fn]A web browser is a software application that enables a user to display and interact with text, images, and other information typically located on a web page at a website on the World Wide Web or a local area network. [/fn] understand, usually HTML or XHTML.

Output HTML source:

    <p>BBCode is an abbreviation for Bulletin Board Code, the lightweight markup language<sup class="bb-see-footnote" title="A lightweight markup language is a markup language with a simple syntax, designed to be easy for a human to enter with a simple text editor, and easy to read in its raw form."><a href="#bb-footnote-1">1</a></sup> used to format posts in many message boards. It is also called forum codes. The available tags are usually indicated by rectangular brackets surrounding a keyword, and they are parsed by the message board system before being translated into a markup language that web browsers<sup class="bb-see-footnote" title="A web browser is a software application that enables a user to display and interact with text, images, and other information typically located on a web page at a website on the World Wide Web or a local area network. "><a href="#bb-footnote-2">2</a></sup> understand, usually HTML or XHTML.</p>
<div class="bb-footnotes">
  <ol>
    <li id="bb-footnote-1">A lightweight markup language is a markup language with a simple syntax, designed to be easy for a human to enter with a simple text editor, and easy to read in its raw form.</li>
    <li id="bb-footnote-2">A web browser is a software application that enables a user to display and interact with text, images, and other information typically located on a web page at a website on the World Wide Web or a local area network. </li>
  </ol>
</div>

Example of CSS:

div.bb-footnotes {
  margin-top: 4em;
  border-top: 1px solid black;
}
sup.bb-see-footnote {
  vertical-align: top;
  font-size: 0.7em;
  font-weight: bold;
  border-bottom: 2px solid orange;
}