I’m facing a problem with automatic text visual replacement.
I’d like to replace automatically some content with readOnly and non removable fulline widgets while keeping the correct line numbers (for backend sync purpose) but it looks like a bit tricky as the textmarker implementation is designed for inline widget purpose only.
I tried to mix empty readonly left and right inclusive textMarkers with line widgets but there is still a problem as the textMarker produce an empty span (Markedspan ?) I’d like to remove because:
keyboard navigation is then strange (you must press two times on the Left key for instance)
content deletion may put the cursor after the marker without any possibilities to go back or put the cursor before it
Could you give me some hints how I can implement this kind of functionality ?
Here is an example of what I’m trying to achieve:
- Example with inline widget: http://jsfiddle.net/8rhhpsxs/1/ (problem: impossible to set as block without breaking the editor)
- Example with invisible marker mixed with a full line widget: http://jsfiddle.net/85L2r6yk/1/ (problems with keyboard navigation as the invisible unicode character is present in the marker and futhermore, using the delete key at the end of the first line cause problems as the marked content goes at first line)
By the way in both case deleting content will sometimes put the cursor at a wrong position: the marker is still present but I’m unable to go back with the arrow keys (pressing “left” can’t help here).
I could of course erase the content and use line widgets but I will loose the original number of lines in the code what is also problematic.
Any idea ?
Thanks in advance!