Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: Overlapping highlights cause text to be switched around. #27

Open
fzzylogic opened this issue Sep 17, 2016 · 6 comments
Open

bug: Overlapping highlights cause text to be switched around. #27

fzzylogic opened this issue Sep 17, 2016 · 6 comments

Comments

@fzzylogic
Copy link

Here's a bug i noticed.

  1. In the simple demo, highlight the "Lorem ipsum" header.
  2. Select another color, and highlight from "Lorum" till halfway in "ipsum".

The letters in the header will be switched around, for example to "sumLorem ip"

  • This does not happen when doing the same with text within a paragraph.
  • It does happen when a highlighted selection spans paragraphs.

Btw, texthighlighter is great, thanks for making it available!

@Doyel
Copy link

Doyel commented Nov 26, 2016

Hi,

I have also come across the same bug. Have you figured out any solution to it? Or any work-around? Please let me know! I will love to learn about it, if there is any.

  • Saswati

@fzzylogic
Copy link
Author

fzzylogic commented Nov 26, 2016

Don't know of a solution yet. Found another highlighter called rangy, not sure if it would help you. But i am still holding out for mir3z to get to this some time as i quite like this implementation. Maybe there's something in the forks.

Cool, i found a fork where this is fixed.

Edit: Sorry, it's not fixed there. A workaround may be to use the onBeforeHighlight callback to remove the underlying highlight first.

@Fr3z
Copy link

Fr3z commented Jun 21, 2017

Hi,

Anyone found a solution for this?

Kind regards

@fzzylogic
Copy link
Author

fzzylogic commented Jun 21, 2017

Not that i know of. When a range is highlighted, the onBeforeHighlight callback receives the range and gives you a chance to do stuff before highlighting happens. Haven't had a chance to look at this, but i suspect clearing any previously selected highlights at that point, by looping over each element in the range and passing it to removeHighlights(element), may resolve this. Please mention if that works for you. Not really a solution obviously. Tx.

@Doyel
Copy link

Doyel commented Jun 21, 2017

Hi,

I was able to make the code that fzzylogic had pointed to work for me, with some changes. I have attached the working version of the file below. The below file also includes a fix for a bug that failed to store highlights when multiple colors were used to highlight the same text overlapping with each other.

Please make sure to change the extension to "js" from "txt". GitHub was not allowing me to upload the file otherwise.

TextHighlighter.txt

@fzzylogic
Copy link
Author

Works great, thanks for sharing!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants