It's been over a year since I posted my demoapp of FCKEditor-integration with Lotus Domino.
The CKEditor (the new and improved!!! version of FCKEditor) has been out for a little while now. At first, the upload integration wasn't documented, so I didn't want to waste time reverse engineering the functionality.
I got a mail a couple of days ago from a reader about CKEditor-integration with Domino. I replied that I would create a demoapp of the integration as soon as the upload functionality was documented. Now it is (more or less).
The new API for FCKEditor is BIG, but that doesn't show on the CKEditor. Its fast as *insert something extremely fast*. Test out their demo if you don't believe me!
The only thing that's changed since the FCKEditor demoapp is the $$Return on the (f)ckupload form, and the hooks I use to rewrite the name of the upload field.
I tested the demoapp in IE8, Firefox 3.5, and Opera 10. Let me know if it doesn't work for you.
CKEditor must be installed in the ..data\domino\html\js folder (you have to create the js folder if you don't have one already). Test http://yourdomain.com/js/ckeditor/ckeditor.js to see if CKEditor is in the correct folder.
This also works on localhost, if you want to experiment on your own computer.
Read the FCKEditor-integration with Lotus Domino post as well. I may have forgot to mention some details.
Anyways, it's time to go to bed. Another day, another dime tomorrow.
>> Demoapp of integration with CKEditor
23 comments:
good good good!
I understood CK Editor is going to be included in Quickr 8.x
Although I don't use Quickr, this would be great news, as it would mean more money to the project -> better product.
Which version did you use? I see version 3.0 and 2.6.5, both released one day apart.
@Rob: This blogpost is about CKEditor.
I've linked to my previous FCKEditor-integration at the top of the post.
FCKEditor is all < 3 releases.
CKEditor, which is rewritten from the ground up, is version 3 and above.
Fantastic article and many thanks for the demo db as well....it all works first time.
@Andrew: I wouldn't call it an article (I'm a blogger with a few tricks up my sleeve), but you're welcome.. :)
Hi Tommy,
Having tested it a little more extensively, I'm having problems editing an existing doc and uploading another file or picture to it (using IE8). I get the following JS error details on pressing the "Send it to Server" button:
Message: '_.filebrowserSe' is null or not an object
Line: 47
Char: 2232
Code: 0
URI: http://localhost/js/ckeditor/ckeditor.js
Does anyone else have the same issue or is it something local to me?
Judging by the error message, it looks like you have the file browser enabled?
Try to disable it, and see if you still get the error.
Hi Tommy,
You've done a very good staff, really,
I download your implementation for CKEditor, it works fine with XPage but i get an error with the form implementation when I try to upload a file or an image : http Error 500
"Exception de chargement de fichiers (File Upload) non autorisée "
Do you know what should I do to solve it ?
Thank you in advance for your help,
Most likely it's the upload-form that's changed.
Open the ckupload form on the web, view source, and see what the name of the upload field (input type=file) is.
In the demoapp it's "%%File.c125746700522db9.5c6ed0a0107a57a8c125746700522f3e.$Body.0.70"
In the ckeditor_loader script library, near the bottom, look for this line:
//Unique identifier snapped from HTML-source of the ckupload-form
var fieldName = '%%File.' + replicaId + '.5c6ed0a0107a57a8c125746700522f3e.$Body.0.70';
If the name of the upload control has changed, replace the existing one with the new. If the database you're working on is a template, compute the replicaid in the fieldname as I did in the JS-header of the demo-form.
I believe the replicaid has to be the same as the db you're uploading to.
Tommy,
Thank you very much, the name of the upload control has actually changed.
After having replace the existing one with the new it works fine.
I would like to have your advice about these questions :
- Do you think CKEditor can be a better option than the native editor?
- I would like to "upgrade" my databases from notes client to xpage. These databases we only be used in web mode after that.
Is there a way not to loose the content in documents when users will for the first time edit and save documents in web mode?
Sorry for my english.
If you decide to use CKEditor over the native editor, the content will be XPages/web only (shows as html in a regular Notes app), as it's stored as HTML. That's the only downside I can see with the CKEditor solution.
There are rumors about CKEditor being the native RichText editor in Domino 8.5.2, so if you're not in a hurry, you'd may want you use the native editor until this is officially confirmed.
If you decide on this CKEditor solution, you have to convert the RichText fields to HTML.
You can get the html from your existing RichTextFields like this
Hi Tommy,
Thank you again for your helpful answers.
It would be a good news if IBM could uses CK Editor, we can expect they will solve some of theses two lasts problems:
- When a user remove a link the attachment (contained in a Lotus document) stays in the database, same for pictures.
- There is no section available, I think I will try to add it myself in CK Editor, but I also think that if it is not yet possible natively, it might be because it is no that easy.
Regarding links, you could have an scheduled agent that FTSearches the content documents for the UNIDs of the "attachment" documents.
In the applications I work with, I let the attachments stay as they are in case someone has linked to them from outside the application. Storage isn't that expensive these days.
Regarding sections, you'd have to dig into the CKEditor API. It probably wouldn't be that hard to insert them, but making them easy to edit would probably take a lot of time.
Hi Tommy,
Do you think it is possible to upload files and pictures in the current document instead of storing it in another document? Could you give me a clue to do that?
Thank you very much
I haven't done it myself, but you would basically need to have a JS variable that says when the current document is new (store in a temporary doc)/when you're working on an existing document (store in same). Also a WebQuerySave agent that fetches the image from the tempdoc when a new document is saved.
Read my previous blogposts on FCKEditor/CKEditor on how the integration between Domino and the editor works.
Hi Tommy,
you've done a great job.
My name is Siamak and would like to use your demo app(CkEditor integration with domino)in my Domino app, however, when I use the link option to upload file attachment (i,e MS.Word), would like to have the icon for MS.Word showing up beside its name when inserting it into the Editor. Could you help me with that please.
I'd really appreciate your help.
Sorry Siamak.. I don't know enough about the CKEditor API to be much help.
That's a question more suited for the CKEditor forums.
Hi Tommy,
Very helpful article.
I am not able to test it successfully on my local system using Domino form. It gives the message "Dojo is not available. CKEditor will not load".
Can you please let me know what I am missing.
What version of Notes/Domino are you running? I think the demoapp was written for N/D 8.5. Maybe 8.5.1.
Hi Tommy, I really appreciate what you have done. I need a help
I tried but i got an error when clicked "send it to server" button in upload tab. The error message are "HTTP Web Server: Invalid URL Exception ".
Thanks Before
If you read the comments in this post, and the post about FCKEditor integration, there are other people that had similar issues.
Have you tested the suggestions I gave to there?
Hi Tommy,
I am using your idea of integrating the CKEditor with Domino. Instead of saving in the separate documents, in the query save, I am reattaching the file with the same rich text field. Everything works perfectly until this. when I add another CKEditor field on the same page, I get the below error when clicking the "Send it to server". I can see the file attached and the document created in the backend. "SCRIPT5007: Unable to get property 'getDialog' of an undefined or null reference. File: ckeditor.js, Line: 873, Column: 79".
I can see the mentioned issue happens in your demo database also. If you fix the issue in your demo databases, that would be great help. If you find some time. Please help. Thanks a lot.
Post a Comment