I am making a little word prediction plugin for tinyMCE and need to extract a bit of text and later insert text from a list of predicted words. The insertion should be no problem, as I know where the cursor is and can use the mceInsertContent
command. Getting the text for the prediction however...
I need to extract a subset of the text ending at the letter immediately before the cursor position and starting at, well, the start of the text. I can strip HTML tags myself if neccessary, but I prefer letting tinyMCE do it if possible.
I was thinking of doing it like this:
mceInsertContent
Now, since I'm not that well versed in tinyMCE that has proved to be a bit of a challenge for me, so how would one go about doing this?
The code needs to work cross-browser.
You may try this code snippets (ed is the tinymce editor object)
A. Insert bookmark at current cursor positon using mceInsertContent
ed.execCommand('mceInsertContent', false,'<span class="marker">\ufeff</span>');
B. Create a range from start of text up to my bookmark.
var rng = ed.selection.getRng(1);
var rng2 = rng.cloneRange();
// set start of range to begin of forst paragraph
rng2.setStartBefore($(ed.getBody()).find('p:first').get(0));
rng2.setEndBefore($(ed.getBody()).find('span.marker').get(0));
ed.selection.setRng(rng2);
C. Get the content of the range.
// get content of selection (range)
var content = ed.selection.getContent({format: 'text'});
D. Delete the bookmark.
$(ed.getBody()).find('span.marker').remove();
Update: If you are concerned about the selection change you may reset your initial range
ed.selection.setRng(rng);