CKEditor Support

I originally tried to support CKEditor just like I did for FCKeditor (patch was required). But there were some issues to be addressed to support CKEditor and I decide to do it later since it make take some time. CKEditor support is one of the next things to do for TinyBrowser.

I did a little bit of experiment this afternoon and I have made the basic functions work (open TinyBrowser window, select image, close TinyBrowser window, insert image back to the small image setting window..) with CKEditor.

The remaining issue is that the vertical scroll bar is somehow not displayed at the TinyBrowser window. I am trying figuring out this issue. I hope that it would not take a long time and I can release a new version that supports CKEditor soon. (hopefully sometime this week?)

Attached is the TinyBrowser module that supports CKEditor (currently only with CKEditor module, not with Wyswyg module). Please use this TinyBrowser module for CKEditor.

There are also two patche files attached.

• ckeditor.module.patch
  This is same as FCKeditor.patch. The Drupal CKEditor module file (sites/all/modules/ckeditor/ckeditor.module) needs to be patched.
• ckeditor.js.patch
  It's turned out that the reason of missing vertical scrollbar at TinyBrowser windows is because of the bug of the ckeditor.js (or maybe just a design which support only file browser that does not use scrollbars). Anyway, CKEditor JS file (sites/all/modules/ckeditor/ckeditor/ckeditor.js) needs to be patched. This patch adds the 'scrollbars=yes' parameter to the proper place of the JS file. Since ckeditor.js is packed Javascript file, it's not easy to manually change it.

Please do not forget to make a backup copy before applying the patch. With my server and Drupal environment, it seems that everying's working OK with CKEditor.
Once it works with your server, I will work on the support for the Wysiwyg module + CKEditor case.

Thank you for your cooperation.

@animelion,

Thanks for testing it. Could you do the followings?

1) Go to TinyBrowser module settings page and make sure that CKEditor with CKEditor module is selected at WYSIWYG editor section.

2) Go to CKEditor module settings page and TinyBrowser is selected at the File browser settings section.

3) Clear Drupal's cache at Administer > Site configuration > Performance page

4) Clear web browser's cache on your local PC

5) Restart web browser

6) If you can check any Javascript error, please find the detail info. (For Firefox, you can open error console from the tools menu and get Javascript error information).

Thank you,

@animelion,

I attached an archive that includes patched ckeditor.module and ckeditor.js file which should replace

sites/all/modules/ckeditor/ckeditor.module
sites/all/modules/ckeditor/ckeditor/ckeditor.js

Please do not forget to back up the original. Once you have set these files, please go to the Administer > Site building > Modules page and disable the CKEditor module first, and then enable it again to make sure the new module's code is loaded.

Please let me know the result. Thanks!

@anilemion,

I am very sorry but I have just realized I needed to give you one more patch for ckeditor.admin.inc.
The reason you did not see the 'TinyBrowser' in the pull-down list of File browser settings of CKEditor.

I attached the new archive, which includes patched ckeditor.admin.inc, which should replace:

sites/all/modules/ckeditor/includes/ckeditor.admin.inc.

Other files in this archive are same as the previous one. Please replace ckeditor.admin.inc with the enclosed one and test it.

Besides, I will do some research on javascript_aggregator module since I may have to add this module as the known conflict and requirement section of the document.

Thank you,

subscribe

@pixture: can you provide patch for source version of ckeditor not minimalised ckeditor.js, but in all i think it should be better way to integrate tinybrowser and ckeditor. One question at last, why you patched ckeditor.js?

Without patching ckeditor.js, the vertical scroll bar would be missing at the TinyBrowser window. Please see the following issue on CKEditor Forum.

http://cksource.com/forums/viewtopic.php?f=11&t=15966

Because the 'ckeditor.js' code is optimized I'm not sure what the actual line number will be for you but I found the spot by searching for 'resizable=yes' and you'll get a couple results, it should be pretty obvious which one is the one you're looking for. It's in a 'popup' object.

Anyhow I just added 'scrollbars=yes' to the string and it worked.

The patch for ckeditor.js does this. I will see if I can provide the patch for non-packed version of ckeditor.js.

It isn't neccessary, i got the metter, now. Thanks for explain

@mephir

OK! I looked at the source code ckeditor/_source/plugins/popup/plugin.js and found that it call window.open() without scrollbars=yes as an option. This is the place where it should be modified.

BTW, could you think of adding code to CKEditor module (ckeditor.module and ckeditor.admin.inc) to support TinyBrowser?

Thanks,

Yes, today i will commit it to CVS, so tomorrow morning should be in dev version. Before it i must do some changes in your patch, like:

$host ."sites/all/modules/tinybrowser/tinybrowser/tinybrowser.php?type=image";

change for proper way to get path etc...

About changes in ckeditor.js. We decided to open ticket for it on our track(http://dev.fckeditor.net/ticket/5167). Now we can change this and i can attached here repacked version with this change.

Thanks for patch, i start to work with it.

Ok, changes commited CVS. CKEditor "scrollbars bug" will be fixed as soon as possible.

Last question, when the changes needed to run tinybrowser with ckeditor will be deployed in tinybrowser module ?

@mephir,

$host ."sites/all/modules/tinybrowser/tinybrowser/tinybrowser.php?type=image";

Yes, this is not a proper code. I guess you have used drupal_get_path('module', 'tinybrowser') instead.
I guess I hardcoded the path for my debug purpose and forgot to change to proper code before releasing it. Thanks!!

BTW, current development snapshot of TinyBrowser already has CKEditor module + CKEditor support code. I will release it as next official release (beta-2) sometime this week too. :-)

Hi I installed TinyBrowser with CKEditor module + CKEditor support code.

It creates the browse server button and opens up TinyBrowser.

It shows the files as a list. (Unable to select a Tumbnail view.
I can upload images, delete images, but cant insert them into the node from the TinyBrowser interface.
The file system works.

So the 2 major problems are:

No thumbnail creation
Unable to insert images

PS: where is those other feature of resizing and rotating?

1. Are you sure that you are using Image browser? It sounds like you are using File browser. File browser does not have Thumbnail view and no rotate/resize operations under Edit panel.

2. What happens when you select a file from the list? Does it insert the anchor tag of the file? or nothing????
If nothign happens, check the Javascript error (refer to the troubleshooting page).

Hi,

In CKeditor under file browser I have selected Tinybrowser.

Do i need to set it somewhere else?

Nothing happens when i select a file.

I have no js warnings.

No activities for a couple of month.

Hello
install tinybrowser to CKEditor 6.x-1.6
The patch no longer work,
you have an update
thank you