Inline annotations and on word-boundaries

[hermanbanken]

It's important that we modify the annotation/explanation requests texts to be on word-boundaries. If not, we insert a button or other HTML that will break the flow of that word, allowing it to wrap across multiple lines. This can be prevented by extending the selection to the nearest space/punctuation.

Furthermore we need to make sure that we insert inline/inline-block elements only, otherwise we mess up the flow of the article as can be seen below:

This is an annotation request that came from the API btw 👍

[hermanbanken]

@korsvanloon I assigned you as you are the main webplugin author, however I can help if you'd like. I've worked with HTML Ranges and selections before...

[korsvanloon]

I think this had to do with some server side error exchanging the text with the text_content and so created a button for the whole paragraph instead of just the phrase.

This has long been fixed so I'm closing this issue.

[hermanbanken]

No, it had nothing to do with that.

[hermanbanken]

It was related to the fact that your annotation-underline div/button was block instead of inline.

Furthermore I asked you to snap the users selection to word boundaries. When I select a text in the document, we would want to snap this to word boundaries, because otherwise we are breaking up the text by inserting HTML in between. Consider this:

bla bla blablablabla bla

bla bla bla<button>blablabla bla</button>

Now 3 bla's would appear on the first line, and the 3x bla + 1 would appear on the next line, where previously the 4x bla would be kept together.