manubot / rootstock

Clone me to create your Manubot manuscript
https://manubot.github.io/rootstock/
Other
451 stars 178 forks source link

Tooltip plugin footnote support #352

Open dhimmel opened 4 years ago

dhimmel commented 4 years ago

@cthoyt asked on twitter about footnote support.

Pandoc has a markdown syntax for including footnotes. @cthoyt added some footnotes to his manuscript in https://github.com/chemical-roles/manuscript/commit/9343961e326610c0f4173c4f7a63b84eb1a78305, which can be seen in this manuscript.

Pandoc created the following HTML:

<a href="#fn1" class="footnote-ref" id="fnref1" role="doc-noteref" data-selected="false" data-highlighted="false"><sup>1</sup></a>
<li id="fn1" role="doc-endnote"><p>Throughout this article, genes and their protein products will be referenced by their human gene symbol and HGNC identifier unless otherwise noted to improve readability.<a href="#fnref1" class="footnote-back" role="doc-backlink" data-selected="false" data-highlighted="false">↩︎</a></p></li>```

@vincerubinetti Would it be possible to configure the tooltip javascript plugin to show footnotes upon hover? This would make it so the user doesn't have to go to the end of the manuscript to read the footnote text.

vincerubinetti commented 4 years ago

This could be done without too much trouble. But as with most of the plugins, there has to be some assumption of the structure of the html. Is there a standard pandoc filter for footnotes we want to support. It seems like @cthoyt must've used some kind of filter in that manuscript.

dhimmel commented 4 years ago

The footnote functionality is called an extension. Pandoc defaults to enabling the footnotes extension for markdown.

But as with most of the plugins, there has to be some assumption of the structure of the html.

Since this is actually core pandoc, I think we can assume some stability. There's no guarantee pandoc doesn't change the output format syntax, but they don't seem to do this too often.

This try pandoc utility can be helpful. For this markdown input text.^[note], the following HTML is created:

<p>text.<a href="#fn1" class="footnote-ref" id="fnref1" role="doc-noteref"><sup>1</sup></a></p>
<section class="footnotes" role="doc-endnotes">
<hr />
<ol>
<li id="fn1" role="doc-endnote"><p>note<a href="#fnref1" class="footnote-back" role="doc-backlink">↩︎</a></p></li>
</ol>
</section>