Feature idea: Visual linkage between original C and English explanation

[levincozza]

Hey, thanks for building this tool, it's been really useful.

I had an idea while using the tool:

• Alongside the english translation highlighting, showing the original C code highlighted by token type as well would be really cool, and bridge the gap between the declarations they put in, and the english they get out. (Visual explanation in the mockup image below)
• Ability to hover tokens of either original C code, or english translation, and it would underline both the token and the corresponding english translation. (Depicted by the red arrows)

Here's a quick mockup of what I mean:

I don't write in Rust, so I'm not sure what the best implementation path would be, and am not confident in sending a PR with this feature. But from looking at the repo, it seems like it might be possible by storing the spans from the parser and reusing the highlighting system. Of course, you'd know best how/if to implement this. I just thought I'd share the idea in case it's useful.

[kdkasad]

These are both good ideas. The main reason I didn't implement these features from the start is because the web frontend is the least interesting part of the project to me. I mainly wanted to practice using parser combinators, so the web UI was an afterthought.

Alongside the english translation highlighting, showing the original C code highlighted by token type as well would be really cool, and bridge the gap between the declarations they put in, and the english they get out. (Visual explanation in the mockup image below)

This would require splitting the input into many HTML elements instead of a single <textarea>. It's definitely doable (and probably would be easiest to use a third-party implementation like monaco.

Ability to hover tokens of either original C code, or english translation, and it would underline both the token and the corresponding english translation. (Depicted by the red arrows)

It's pretty easy to attach the span information when doing the parsing. I think the main implementation challenge would be the web UI, as it would also require splitting the input text box into many HTML elements so we can detect which tokens are being hovered.

Anyways, these are both features I'd like to support, so I'll leave the issue open, though I don't think I'll get around to it any time soon.

[kdkasad]

Bookmarking this here for reference as they have a very nice implementation:
https://explainshell.com

Thanks @ericswpark!

[kdkasad]

Another reference/inspiration bookmark: https://brainfuck.rmjtromp.dev/