Build a highlighter

[BigBlueHat]

This does eek into the realm of UX, so I want to proceed cautiously here. However, juggling the "mixed tree" environment discussed in #21 is likely to be a near everyday occurrence for folks building annotation tools.

If we can collectively solve that issue well, we'll all win. 😁

[BigBlueHat]

Additionally, this might help inform things the browsers need to change/tweak/add about how the DOM itself works and interacts.

[Laurian]

Many years ago, there was http://xpointerlib.mozdev.org a Firefox add-on used for Annotea, that would insert into DOM elements to highlight annotations, while marking those nodes to be ignored in further operations, such that multiple annotations would still more or less anchor.

See function isMarkedIgnore(element) in https://www.mozdev.org/source/browse/xpointerlib/src/components/nsXPointerService.js?rev=1.21;content-type=text%2Fplain

[tilgovi]

Worth taking inspiration from https://github.com/nickstenning/marks too

[tilgovi]

Nice part about inserting mark tags is that it's super boring and the browser styles it.

[tilgovi]

I take that back. I would rather not commit to any tag choice at all right now and just spend some time mulling over what problem(s) really need solving.

Here are some more formed thoughts that have come up for me in the past:

Q: How to denote things added by the annotation layer
A: TDB, but also maybe just doesn't matter to some selectors

Q: How to visualize style / modify the DOM
A: TDB, but generally requires iterating over the text nodes for text use cases

Q: How do we iterate over all the text nodes?
A: NodeIterator, which I even built a polyfill for: https://github.com/tilgovi/dom-node-iterator

I think we need to sketch a couple highlighter implementations and play with them.

[Treora]

Done in PR 59: #59