rangy icon indicating copy to clipboard operation
rangy copied to clipboard

node boundaries and attributes for cssClassApplier

Open tobiasschweizer opened this issue 10 years ago • 1 comments

Hi Tim,

first thing I have to say: I am very happy about the work you are doing (I would not like to do it ;-)).

I am struggling with the range object (startContainer, endContainer, startOffset and endOffset) in different browsers using rangy 1.3.

Please have a look at the following example:

       <div id="text" contenteditable="true">

      Das ist ein <span class="italic"><span class="bold">Test</span>, der</span> nicht viel Sinn macht.

       </div>

Selecting "Test" with the mouse, the result in different browser alters (Chrome, Firefox). While Chrome returns the same textnode ("Test") as startContainer and as endContainer and the corresponding offsets (0 and 4) corresponding to the length of the selection, Firefox would return the node before the selected textnode as startContainer and its full offset (corresponding to its length) and would then return the following node as endContainer with the offset 0.

Using rangy.getSelection().getRangeAt(0) I get a RangyRange, right? Couldn't I expect the same behaviour from all browser?

I am trying to write a generic TextEditor. Now I discovered your CssClassApplierModule which perhaps solves my problems (if I don't have do deal with ranges anymore myself).

As far as I understood, I can add arbitrary cssClasses to the selection using the span element by default and remove them by using toggleSelection, adding and removing of spans with classes is handled automatically

This works fine as far as I have seen. This way I don't have to deal with range objects directly.

There is one thing I have to do: adding atrributes (data-) to the selection. This works with rangy 1.3 (http://stackoverflow.com/questions/20376043/elementproperties-of-rangy-doesnt-work).

My question: each time, I would have to assign a different value to the assigned attribute. Do I have to create another CssClassApplier each time (only to change its elementAttributes)?

Does isAppliedToSelection() only consider the assigned class or does the assigned attribute value also matter?

Thank you very much for your work and your answer. I you are interested in some code (I have tried to write an abstraction layer for the node boundary issue) I would deliver that gladly.

kind regards

Tobias

tobiasschweizer avatar Jun 06 '14 10:06 tobiasschweizer

Hello :) I really, really like this library and happy to use it :) In chrome it is working perfectly, but I need to focus on ff ... Unfortunately (as Tobias wrote) it is not working that perfectly on ff, problem is with double-click (due to bug in offset calculating, I think) - when we want to mark word next to previous tag, node gets start offset = 1 , nodeType = 1 (as parent, not 3). What about this bug? Are you working on this ? :) Best regards, Izabella

izabellaszlosarczyk avatar Jun 19 '17 21:06 izabellaszlosarczyk