Plugin development VERY confusing

One of the ideas I love about the new CKEditor is that everything is a plugin, and as such most of these plugins should be either optional, or completely changeable.

For a site I'm doing, I would like to completely replace the image plugin to choose from a gallery of images a user has already uploaded. This, however, is impossible because the ckeditor.js and ekeditor_basic.js seem to have all the plugins embeded in this one source file. I imagine it's to decrease load time and make the editor load quicker (cutting down on HTTP requests).

One would have thought that the plugins folder would have been loaded in CKEditors root directory, and it seems to for completely custom plugins. However, it's impossible to replace a stock plugin.

Also you would think that loading ckeditor_source.js would load the plugins folder in the _source directory. But instead, it loads the plugins folder in the root directory. If I'm running from source, it should be loading completely from source, shouldn't it?

Right now the only way I can load my own image plugin is by running ckeditor_source.js.

Is there a way to package it myself?

Also what plugins are optional? I tried disabling the image plugin and contextmenu plugin but these two seem "required". Is there a list of plugins that I can get rid of for a basic editor?

EDIT:

I found a reference to "CKPacker" and it seems it combines all the plugins into ckfinder.js, and in ckfinder_basic.js it does not. One would think that they would then be loaded from the plugins folder, but ckfinder_basic.js simply loads ckfinder.js immediately (it seems).

Thanks,

Luke

Sat, 09/05/2009 - 21:10

peej

Joined: 05/09/2009

Posts: 6

Re: Plugin development VERY confusing

You can use a custom image browser with the standard image button without having to build a plugin. It doesn't appear to be working properly at the moment: viewtopic.php?f=11&t=15618

but if you set the configuration to recognize your pages like so:

CKEDITOR.editorConfig = function( config )
{
   // Define changes to default configuration here. For example:
   // config.language = 'fr';
   // config.uiColor = '#AADC6E';
   config.filebrowserBrowseUrl = 'imagegallery.html'; //this is a link to the page that displays your preuploaded images
   config.filebrowserUploadUrl = 'uploadFile.html; //this is the link new files are posted to if they upload a new one.
};

Mon, 09/07/2009 - 05:05

stylo~

Joined: 13/07/2009

Posts: 40

Re: Plugin development VERY confusing

Speaking of confusing, how about how to add a simple custom button or dropdown to insert text?

This obvious question has been asked on this forum about 500 times with no answer yet.

Mon, 09/07/2009 - 06:13

pserwylo

Joined: 07/09/2009

Posts: 4

Re: Plugin development VERY confusing

stylo~ wrote:Speaking of confusing, how about how to add a simple custom button or dropdown to insert text?
This obvious question has been asked on this forum about 500 times with no answer yet.

Mon, 09/07/2009 - 09:22

hendecasyllabic

Joined: 18/08/2009

Posts: 32

Re: Plugin development VERY confusing

I have been changing and adding plugins quite a lot and have found it relatively easy.

I have used the config options removePlugins and extraPlugins. Obviously this means that your new plugin needs to be renamed slightly different from the one it is overwritting but that makes sense if anyone else has to come along and tweak you code as they will know it is nolonger core. (also means it wont be overwritten when you upgrade ckeditor)

e.g.
removePlugins:'save,resize',
extraPlugins:'saveCMS,cmslocation,cmstemplate,autogrow',

you can also pass bespoke config options thr the config area
e.g.
filebrowser_cmsbrowse : '/cgi-bin/go.pl/admin/cms-browse-ckeditor.html',
filebrowser_image_browse_url : '/ckfinder/ckfinder4cms.html?action=js&func=SetUrl&thumbFunc=SetUrl&Type=Images',
filebrowser_file_browse_url : '/ckfinder/ckfinder4cms.html?action=js&func=SetUrl&thumbFunc=SetUrl&Type=Files',

which means you can change these for each instance and then just have your plugin read the path/value that you need to alter from the config file.

Thu, 10/01/2009 - 18:39

luke

Joined: 06/11/2008

Posts: 13

Re: Plugin development VERY confusing

peej wrote:You can use a custom image browser with the standard image button without having to build a plugin. It doesn't appear to be working properly at the moment: viewtopic.php?f=11&t=15618

but if you set the configuration to recognize your pages like so:
CKEDITOR.editorConfig = function( config )
{
   // Define changes to default configuration here. For example:
   // config.language = 'fr';
   // config.uiColor = '#AADC6E';
   config.filebrowserBrowseUrl = 'imagegallery.html'; //this is a link to the page that displays your preuploaded images
   config.filebrowserUploadUrl = 'uploadFile.html; //this is the link new files are posted to if they upload a new one.
};
The file you'll need to modify is called config.js and is located in the root folder of the Javascript. There's more info in the help files: http://docs.fckeditor.net/CKEditor_3.x/ ... _(Uploader)

Sat, 10/03/2009 - 00:05

mattfromga

Joined: 13/12/2008

Posts: 21

Re: Plugin development VERY confusing

If you look at the _source\plugins\image directory you will see all the plugins with full comments and so on. This code is not actually used during run time because it has been compressed into the main js file like you observed. However, it is a great reference and you can modify this code to make a new plug in. However, you will need to copy the image plugin to the root ckeditor plugins folder and CALL IT SOMETHING ELSE, like myimage. Then you need to remove the original image plugin and add your new one:

removePlugins:'image',
extraPlugins:'myimage',

I have been working on some plugin documentation for while, which you can find at http://syrinx.ph/articles/CkEditorPluginGuide.aspx

Hopefully it will help you to understand the overall plugin architecture and successfully get started on your own plugin. I use it for exactly what you are trying to do in our Syrinx Community Server product.