Equation annotation (based on existing code annotation)

[GuillaumeDehaene]

Description

Hello everyone,

TLDR: equation annotation: wouldn't that be cool? what do you think?

As part of my thinking on how to make math better in pandoc markdown and quarto, I've been thinking about making an equation block annotation, copying the existing code annotation.
(obviously, this is a quarto-only feature, centered on HTML output).

For example: (NB: notation is not final, & is an aligment point and \ is a newline)

$$
A &= B \\
   &= C #<1> \\
   &= D #<2> \\
   &= E #<2>
$$
1. Using the relation derived in @eq-relation.
2. Expanding the integral and simplifying the corresponding terms.

would parse into:
Math
Eq. 2: Using ...
Eq. 3-4: Expanding ...
for non html formats, and as a tippy popup for html

I'm not particularly worried about making this first version very clean, so I'll just do an extension with:

• a pandoc filter to process the syntax
• a JS script for a bit of DOM manipulation and registering the popup

One thing that would be super helpful is if somebody experienced with the codebase could point me towards the AST transformations that underlie the code annotation feature?

Cheers
Guillaume

[mcanouil]

You can easily search through the codebase to find at least part of the transformation quite easily:

• https://github.com/quarto-dev/quarto-cli/blob/67de415ee9839f04affc21f064559db7ba60964d/src/resources/filters/quarto-pre/code-annotation.lua

The main difficulty is to make the annotation works for multiple formats, not only HTML.
This might be very tricky for LaTeX.

[GuillaumeDehaene]

Thank you! I was looking at the other repos: I didn't expect the filters to be living in this one.
I was able to find the html styling code by just examining the output html. So I've got everything I need.
I'll do a POC with just the HTML styling and report.

You are right that this would only work well in formats which support tooltips.
For non-dynamic formats, I think it's fine to just aim for comments beneath the equations: it's not like there's a better option currently.
(I guess you could insert comments between two successive lines, but that sounds like a typesetting nightmare).

[GuillaumeDehaene]

Hello everyone,

I've finished a POC in HTML + CSS + JS
View the poc here
The source code is here

I'm overall happy with it's current state, even though it is far from perfect.
In particular, I'm worried that my hacks of the MathJax DOM elements could break things: I'll see if I can get some feedback from that project.

I'll start working on a lua filter to fill out the qmd to html step.

I'd be very happy to get feedback on it, here or by email.

Best
Guillaume

[mbourne]

On a phone, your first example has an issue. I click the second group (tags 3 and 4) but the explanation covers most of the first two tags, making them hard to click.

I suggest right indenting the explanations to avoid this.

Regards
Murray

[GuillaumeDehaene]

That's a good point. Thank you for testing the feature. I'm not sure of the best way to deal with this. Currently, I'm leaning towards controlling the width of the tooltip to be 80% of the width of its parent and anchoring it to the top-left I think that should solve that issue. Le jeu. 16 nov. 2023 à 22:10, mbourne ***@***.***> a écrit :

…

On a phone, your first example has an issue. I click the second group (tags 3 and 4) but the explanation covers most of the first two tags, making them hard to click. I suggest right indenting the explanations to avoid this. Regards Murray — Reply to this email directly, view it on GitHub <#7413 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACZDZEC7KQ3FCU6DOVHJ2LTYEZ6N3AVCNFSM6AAAAAA6V3UXJOVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM3TKOJSGYYDG> . You are receiving this because you authored the thread.Message ID: ***@***.***>