Forum closed. New forum available at http://community.wymeditor.org/

Insert from popup at cursor position

Support forum for WYMeditor.

Insert from popup at cursor position

Postby netnak on Fri Aug 29, 2008 11:13 pm

There's a couple of earlier requests for this, but I still can't find a working example.

I need to create my own dialog boxes (using ASP/PHP) that return an HTML snippet back to the editor at the cursor position. I can use the paste command, but that appends text and surrounds with <p>s. And the Tidy example works on the whole editor HTML,

I need to put my cursor in the middle of a line of text, click a button that pops up a dialog box, run the script on that page that generates some HTML that - on submission - goes back into the editor text. I can do everything, but get the HTML I've generated back into the editor, inserted at the cursor position.

I'm sure the right functions are in the jQuery library, but I've not a clue where.

Can anyone help? Thanks.
netnak
 
Posts: 5
Joined: Fri Aug 29, 2008 11:03 pm

Re: Insert from popup at cursor position

Postby mr_lundis on Sun Aug 31, 2008 7:29 pm

The paste function is for plain text only.

To the best of my knowledge, WYMeditor doesn't at this time provide a good way to insert pure html into the editor at the current caret position. However this piece of functionality is needed and hopefully we'll see it in the upcoming releases of WYM. I'd suggest you to post a feature request for this at the Trac site to speed up the process. Or if you wish to help out even more you could of course write the code needed and may be submit a patch to us, it'd be really appreciated. :wink:
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby netnak on Mon Sep 01, 2008 9:30 am

Many thanks for explaining this.

The inability to insert our own HTML stops us upgrading from version .2 (which had the handy #1#2#3 functionality).

I'll gladly try and contribute. I sort of assumed that, since there is the ability to insert an image, then this insert_image routine itself would reveal how to insert HTML at the caret. I can see the image dialog HTML in the .js file, but if anyone has any guidance on where I might find the calls to jQuery that actually performs the insert, I'd be grateful.
netnak
 
Posts: 5
Joined: Fri Aug 29, 2008 11:03 pm

Re: Insert from popup at cursor position

Postby mr_lundis on Mon Sep 01, 2008 2:10 pm

If I remember this correctly, jQuery isn't used to insert images but the internal image handling functionality of the web browser. Therefore I think you will find very little code of use there.

However, I have looked in to this a bit myself, and it seems like the most efficient way to do this would be to manipulate the contentDocument of the iframe directly. If you can do this with normal jQuery selectors you can pass a second parameter to the $-function - a context, or pass it a DOM element directly.

You can access the iframe contentDocument by the internal _doc property of your current WYMeditor instance.

See:
http://docs.jquery.com/Core/jQuery#expressioncontext

So by looking at the current paste functionality I came up with the following:
Code: Select all
WYMeditor.editor.prototype.pasteHtml = function(sData) {
    var container = this.selected();

    if(container && container.tagName.toLowerCase() != WYMeditor.BODY) {
        jQuery(container).after(sData);
    } else {
        jQuery(this._doc.body).append(sData);
    }
};


This code will take the passed html and insert it after the selected element in the editor. You might also want to check for html validity, make it possible to insert code directly at the selection (i.e. just paste inline elements or split the selected element to insert a new block element) and so on.

Hope this helps, cheers.
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby jfh on Mon Sep 01, 2008 6:53 pm

There was an insertAtCursor(html) function in 0.2, that needs to be ported to current version.
If you develop for FF, you can use the execCommand 'inserthtml', which will insert at HTML at the cursor position.
With MSIE, you'll need to get the caret position in order to insert the content - see getCaretPos() in 0.2 code.

FYI, we use dialogs otherwise the iframe selection is lost in MSIE (if the iframe loses the focus).
This issue is by design in this browser, but we've found a way - that will be implemented in 0.6 - to store the selection.
I guess you can avoid using dialogs in this specific case, because you don't really need to manipulate the selection.
HTH.
User avatar
jfh
Site Admin
 
Posts: 370
Joined: Sat Sep 23, 2006 8:43 pm
Location: Belgium

Re: Insert from popup at cursor position

Postby netnak on Tue Sep 02, 2008 9:47 pm

Thanks for these responses. I will certainly look, but I fear my Javascript skills are not up to it (which is why I need a way of writing my dialogs in ASP!).

So if there are others following this post, please join in the chase.
netnak
 
Posts: 5
Joined: Fri Aug 29, 2008 11:03 pm

Re: Insert from popup at cursor position

Postby mr_lundis on Tue Sep 09, 2008 6:25 pm

Hi all!

I've been working on a port of the old insertAtCursor and getCaretPos functions. But unfortunately my computer just decided to crash, and I currently don't have the time to restore the work. :(
So I'll be posting the code tomorrow or maybe later on this week.

Cheers.
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby Surt on Thu Sep 11, 2008 11:28 am

Hi,

i was working on it at:
viewtopic.php?f=3&t=383
using some code from a french post, you could see the code at the 3rd post.
Surt
 
Posts: 4
Joined: Tue Sep 02, 2008 5:11 pm

Re: Insert from popup at cursor position

Postby mr_lundis on Thu Sep 11, 2008 8:51 pm

Surt wrote:Hi,
i was working on it at:
viewtopic.php?f=3&t=383
using some code from a french post, you could see the code at the 3rd post.

Yeah, I know. I've even snitched some of you code. :wink:


Does anyone information on how Safari handles this? I haven't got the time to look in to the RTE functionality in Safari yet, however I've got things to work in most other browsers. (Can't test in IE 7/8 and Safari since I'm currently running Linux)
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby mr_lundis on Sat Sep 13, 2008 1:42 pm

Finally I've found some time to put everything together. I've packed everything as a plug in, you'll just need to include it then you're good to go.

Usage:
Call the insertAtCaret method whenever you wish to insert pure html into the editor.

Example:
Code: Select all
yourWymInstance.insertAtCaret('a html snippet');

You can get a reference to your current WYMeditor instance like this:
Code: Select all
yourWymInstance = jQuery.wymeditors(0);

Change the zero to match the index of the instance you want to access.

Download:
insertAtcaret.zip
(8.88 KiB) Downloaded 544 times

Alternate download:
insertAtcaret.tar.gz
(7.58 KiB) Downloaded 503 times


For additional details, see the README file.
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby jfh on Sat Sep 13, 2008 7:34 pm

Thanks! I've included the code in the core files, see r541.
The function is 'insert()' instead of 'insertAtCursor' or 'insertAtCaret()'.

If you want to discuss about it, or report a bug, please reopen and comment the ticket #120.
User avatar
jfh
Site Admin
 
Posts: 370
Joined: Sat Sep 23, 2006 8:43 pm
Location: Belgium

Re: Insert from popup at cursor position

Postby netnak on Tue Sep 16, 2008 7:25 pm

Having started this thread, I'm very,very grateful you guys have found a solution. Thank you!
netnak
 
Posts: 5
Joined: Fri Aug 29, 2008 11:03 pm

Re: Insert from popup at cursor position

Postby netnak on Sun Sep 21, 2008 4:49 pm

Now I've tested it; it all works brilliantly. Thanks again. But I also now understand an earlier comment in this thread:

"FYI, we use dialogs otherwise the iframe selection is lost in MSIE (if the iframe loses the focus).
This issue is by design in this browser, but we've found a way - that will be implemented in 0.6 - to store the selection.
I guess you can avoid using dialogs in this specific case, because you don't really need to manipulate the selection.
HTH."

Unfortunately I do want to manipulate the selection in some instances. Yes, I can now insert my own HTML (derived from code that, typically, picks data from some database or other), but if the user comes back to edit their inserted snippet, they will select it and expect my code to understand its contents. So for this I guess I await 0.6 (and continue to grumble about all things IE...). The road map has 0.6 a mere week away. Is this still the case or have you a revised estimate?
netnak
 
Posts: 5
Joined: Fri Aug 29, 2008 11:03 pm

Re: Insert from popup at cursor position

Postby mr_lundis on Sun Sep 21, 2008 7:41 pm

netnak wrote:Having started this thread, I'm very,very grateful you guys have found a solution. Thank you!

You're welcome!

netnak wrote:Unfortunately I do want to manipulate the selection in some instances. Yes, I can now insert my own HTML (derived from code that, typically, picks data from some database or other), but if the user comes back to edit their inserted snippet, they will select it and expect my code to understand its contents. So for this I guess I await 0.6 (and continue to grumble about all things IE...).

I'm sorry, but I can't see your problem here. If you want to open a dialogue, you'll need to open it in an external window for the time being. Or is it getting the current selection itself that you're having a hard time with?


netnak wrote:The road map has 0.6 a mere week away. Is this still the case or have you a revised estimate?

0.6 probably won't be released any time soon. Primary focus right now is to get 0.5 out there first, and the 0.6 code is still very experimental.
Jonatan Lundin - designer, developer and forum moderator. You should follow me on Twitter!
mr_lundis
 
Posts: 335
Joined: Sun Dec 02, 2007 10:59 am
Location: Sweden

Re: Insert from popup at cursor position

Postby jfh on Thu Sep 25, 2008 8:43 pm

FYI there's a new function available to wrap/unwrap inline content with custom elements such as span.
See r545.
The code is quite basic/beta ATM but already cross-browser.
A test page is available at http://files.wymeditor.org/wymeditor/tr ... /wrap.html

HTH
User avatar
jfh
Site Admin
 
Posts: 370
Joined: Sat Sep 23, 2006 8:43 pm
Location: Belgium

Next

Return to Support

Who is online

Users browsing this forum: No registered users and 1 guest