On Apr 6, 8:04 pm, Kenneth McDonald <[EMAIL PROTECTED]> wrote: > I'm attempting to write a "pure DOM" text editor, i.e. one that doesn't > make any use of special features that are used (I think) by all of the > current WYSIWYG in-browser editors. The problem I'm trying to resolve > right now is; when the user moves the cursor vertically, how do I > determine where to position it? > > For example, let's say they press the up arrow key to move the cursor up > one line. Assume for the time being that the text will be in a linear > left to right, top to bottom Western layout. Moving the cursor up should > leave it in the line that is visually above the line the cursor was > previously on, with its x-position as near as possible to its previous > x-position. > > However, there doesn't seem in JS to be any way of finding the bounding > box of individual characters within text nodes. The two solutions I've > come up with are > > 1) Using a 0-width SPAN element, successively move it backwards one > character at a time, testing its coordinates at each position, until a > suitable position is found. normalize text nodes as the SPAN element > "leaves" them. > 2) Move backwards one text node at a time; at each text node, "explode" > that node by placing each character into a single SPAN element, and then > test the bounding box of each character. When leaving a text node, > "implode" it back to its previous state. > > Aside from being a bit of a pain to program, my main concern with these > methods is that they might be too computationally intensive. The first > will require a lot of splitting and rejoining of text node contents, > while the second may require (depending on the size of the text node) > creating a great many one-character DOM elements. > > More importantly, I'm worried about how much rendering time this might > take; if the browser does a full re-render each time (even though, > theoretically, neither of the above methods should actually cause any > visible change in the page (I think), that could chew up some > significant time. If anyone familiar with the internals of Gecko could > comment, I'd greatly appreciate it. > > And, if anyone knows of a simpler method of doing this, please let me know! > > Thanks, > Ken
If you know a piece of text does not wrap and you are using xhtml, you could try overlaying it with the same invisible(opacity="0") text and font in SVG and then use the SVG DOM to get the positions of individual characters. _______________________________________________ dev-tech-layout mailing list [EMAIL PROTECTED] https://lists.mozilla.org/listinfo/dev-tech-layout
