Hello,

Instead of the link to the footnote, I only have: <sup>2</sup>, as mentionned in previous issue.
My friend in her website is creating long pages with a lot of footnotes. In order to make it easy to consult the content of those footnotes, it would be nice if you could add the content of the footnote within a tooltip like this:
<sup title="This is the content of the footnote">1</sup>.

(hover over the link "her website" above to see an example of what I mean).

Thanks :)

CommentFileSizeAuthor
#7 footnote.tooltip.png301.07 KBbeginner
#5 footnote.tooltip.diff_0.txt893 bytesbeginner
#4 footnote.tooltip.diff.txt797 bytesbeginner

Comments

beginner’s picture

beginner commented

This issue is a little more complicated than I first thought: all HTML tags should be stripped before adding the text within the tooltip.
Is there an existing filter within Drupal that strips *all* tags.

Also, how do you force a new line within a tooltip? Last time I tried, \n didn't work.

hingo’s picture

hingo commented

Yes, this is the reason I didn't use title for anything, since I definitively want to allow html formatting withing the footnote.

I had something similar in mind though. The idea is to put the footnote in a <div style="display: hidden;"> and then use css and javascript to bring it up from the links onmouseover attribute. Or with some similar css trick, though the javascript option is probably safer with older browsers in mind.

But since that is nontrivial, I just left it for later (or for someone else to do :-)

beginner’s picture

beginner commented

I prefer a tooltip solution to a javascript solution: it is less intrusive, works even when javascript is off, and also easier to use (no need to click on/off (show/hide) the footnote.

It should be easy to find a regex that gets rid of all HTML tags.
If you wish, I'll do it, but only much later as I have other things more urgent right now.

beginner’s picture

beginner commented
Status: Active » Needs review
StatusFileSize
new footnote.tooltip.diff.txt797 bytes

The solution is actually much easier than I thought in #1 :)

We only need to use the drupal function filter_xss(), passing an empty array of allowed tags.
The code is simple and it works exactly as intended :)

beginner’s picture

beginner commented
StatusFileSize
new footnote.tooltip.diff_0.txt893 bytes

replace double quotes with single quotes in order not to interfer with the title="" html.

beginner’s picture

beginner commented

see result in this article with many footnotes:

http://www.reuniting.info/wisdom/sources/metaphysical/a_course_in_miracl...

but I noticed one thing: while konqueror shows the content of the whole footnote in the tooltip, firefox truncate the footnote so that the tooltip doesn't exceed a certain size. I don't know about commercial browsers.
This is a browser issue about which I cannot do anything.

beginner’s picture

beginner commented
StatusFileSize
new footnote.tooltip.png301.07 KB

konqueror shows the content of the whole footnote in the tooltip

hingo’s picture

hingo commented

I checked the other browsers too. To sum up

1) Konqueror, works perfectly
2) IE, works perfectly, as far as I can tell.
3) Firefox, truncates title. (Works only for very short footnotes.)
4) Opera (8.something), doesn't work. Shows address where link is leading.

I will have to think about what to do with this, and perhaps try to find out the reason why Firefox does what it does. I'll probably merge this later.

PS. Double quotes " should be transferred to &quot; their equivalent entities!

hingo’s picture

hingo commented

The Firefox behavior is a known bug in mozilla code. And guess what, it has been active since 2000! There is a plugin that can be installed to fix the bug, while mozilla core developers are debating over the correct fix.

Conclusion: I'll probably merge this patch then...

hingo’s picture

hingo commented
Status: Needs review » Fixed

I have now applied and committed this patch to cvs, thanks for implementing this!

I also added removal of newlines, as the line break filter also wanted to tamper with line breaks within the title attribute.

beginner’s picture

beginner commented

Hello,

I hope you had a nice holiday, :)
Thanks for committing this patch (the use of " is indeed better!).

Also, thanks a lot for the links to the firefox bug and plugin: I was hoping that there was one for that!
It's very useful.

Blessings,

beginner’s picture

beginner commented

(I meant the use of the html entity &quot; is indeed better).

hingo’s picture

hingo commented
Status: Fixed » Closed (fixed)