2008/05/16

ServerPreview plugin for FCKeditor 2.5+

Yes, a little too late, but better late than never.

Finally, here is the updated version of the ServerPreview plugin.

As mentioned in the original release, this is a very simple plugin, and the new version is even simpler. I've removed the need to add a new button and the plugin just replaces the original preview command, so the only thing that you need to make it work is:

  1. Extract the plugin to your plugins folder
  2. Like the rest of plugins, add it to your instance: FCKConfig.Plugins.Add( 'serverPreview' ) ;
  3. Set the url of the page that will receive the data: FCKConfig.ServerPreviewPath

Then you just put all the server code that you want in that page, and read the data that is sent in the 'htmlData' field. You can change the plugin to add more fields if you need to. It could be possible to write a generic code to send all the current fields to the server, but I've never found enough time to write it (it just took me 6 months to write this post)

You can see a demo at the Google maps demo (due to the use of document.write the normal preview fails, so this plugin is really useful for that situation)

I haven't write a specific demo page for this plugin or other detailed installation instructions, so just go to SourceForge and get it.

2008/04/19

Update of easyUpload for FCKeditor 2.6

A while back I was contacted by Graham Glass, as he needed some simplified versions of the link and image dialogs in order to use FCKeditor in his Edu2.0 project.

It was an interesting task, mainly because it made me realize about the need to be able to do custom changes to the dialogs without changing the core files. Having an event system that allows to change the interface just when it's being created seems like a good option, let's hope that something like that is available for V3.

But let's back to the topic. Due to some changes about how the links are created internally in the call to FCK.CreateLink, now the return object is an array instead of a link so the old code no longer worked and it gave errors.

So I've updated the plugin and created a demo page of easyUpload to check how it works.

The plugin does include three options:

Image upload.

Images are uploaded in just two steps. First select the image and press Continue

Then adjust its parameters, and press OK

File upload

Just select the file that you want to add and add a text that will be shown as a tooltip. When you press OK the file is uploaded and a link is created with the name of the file

Simplified link dialog

The only option is to write the URL that you want to link. It's almost impossible to do it wrong.

 

2008/03/15

WriteArea 0.6 now with Spellchecker

I've uploaded to the Sandbox the version 0.6 of Write Area. This version (besides the bump to support FF3b4) does add the ability to use the spellchecker from inside the editor.

Thanks to the chrome privileges it's possible to access directly to the internal data about the spellcheck and that way I can add it to the context menu, just as easy as in any other textarea, there's no need to choose between the FCKeditor context menus to manipulate the content or the Firefox default menus to use the spellcheck.

I'm gonna leave it a few days and if everything is fine then I'll review a few details and then I'll ask to make the extension public, so I would ask that anyone that it's reading this, please, go to the Firefox extensions site, if you don't have an account, then apply for one, it takes no time at all, when you are registered then login and install the Write Area extension.

Now go to a site where you can use HTML in a textarea, (for example this Blogger site, Slashdot or any other of the thousands of sites available), open the context menu and select "Edit with Write Area", and you'll see the editor. Play with it, give it a go and when you are done, then go back to the Write Area page and write a review (if it's nice I'll be happier, but any review is good as long as it's done with good will)

Enjoy it.

CKFinder 1.2, now in your own language

Yesterday was released the new version of CKFinder, with one of the most important changes for 1.2 being the ability to show the interface in the language of each user.

Besides some fixes and improvements, another important addition is the ability to filter files and folders on the server, so by default all .* files are hidden, and it's possible to customize the filters so that it matches your needs.

With regards to the localization, in 1.2 there are four languages included (besides English): German, Italian, Polish and Spanish, but if you need to add another language you just have to follow the localization guide for CKFinder.

Of course, if you create any such translation the recommended procedure is to send it back so it can be added for the rest of the people and you don't have to worry about how to update it with any new version.

I hope that all of you enjoy this version.

 

2008/02/15

Adding configuration entries when creating a FCKeditor instance

When you create a instance of FCKeditor using any of the integration methods (javascript, PHP, asp, coldfusion...) you first create an object, but that object isn't the real FCKeditor object (it might be obvious when talking about server integration methods, as FCKeditor is run as javascript in the client, not on the server. But but difference is very important when creating the object in javascript).

You can check the properties of that object in the fckeditor.* files at the root of the distribution, but basically they are:

Instance name

The name of the FCKeditor object. It will be used when the data is sent back to the server as another form element, or you can use the FCKeditorAPI.GetInstance function from the API to get the FCKeditor object and work with it from Javascript.

Width, Height

Obviously the Width and Height that will be used to create the element in the page.

Toolbarset

The toolbar that you want to use for this instance.

BasePath

The folder where the FCKeditor files are in your server. If you put a wrong value here you'll get lots of errors and nothing will work.

 

That's all. There are no more properties on the creation of the FCKeditor instance.

And you might ask "How am I supposed to configure any additional option?, Am I forced to always modify the fckconfig.js file?"

Well, I've lied a little, there's one extra property, the Config object, that's an object that allows to set pairs of propertie:value for the configuration options that you might set in the fckconfig.js file. There are some very important restrictions: you can't set here any OBJECT or ARRAY, you can set only STRINGS, NUMBERS or BOOLEAN values. But besides that restrictions, you are free to add any value here, as long as you set something that it's correct then you don't have to modify the fckconfig.js (I mean something valid, because some people write just anything here and expect it to magically work. It must be something that is allowed as a property of FCKConfig. in the fckconfig.js file

Let's do some examples with the GoogleMaps_Key value used in the GoogleMaps plugin:

In Javascript:

var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.Config["GoogleMaps_Key"] = 'ABQIAAAAlXu5Pw6DFAUgqM2wQn01gxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSy5hTGQdsosYD3dz6faZHVrO-02A';
... 

In PHP:

$oFCKeditor = new FCKeditor('FCKeditor1') ;
$oFCKeditor->Config['GoogleMaps_Key']  = 'ABQIAAAAlXu5Pw6DFAUgqM2wQn01gxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSy5hTGQdsosYD3dz6faZHVrO-02A' ;
... 

In Asp:

Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.Config("GoogleMaps_Key") = "ABQIAAAAlXu5Pw6DFAUgqM2wQn01gxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSy5hTGQdsosYD3dz6faZHVrO-02A"
...

It's just the same for every language, you use the "creator" object, and then set in its Config object the property that you want.

 

2008/02/03

GoogleMaps in FCKeditor

A little while ago I took the task suggested by dynamical.biz to implement a plugin for FCKeditor that would allow any end user to easily create a Google Map that can be inserted in the content and so it will be shown in the final page as he wanted.

It isn't an easy task because there are several little problems, mainly the fact that any javascript code is automatically protected so it won't be available in the DOM. Also, the plugin should be able to update the existing maps because we know that while you are editing something looks mostly OK, but when you finally see all the final page maybe you wish that it could have been a little bigger, or smaller, the map should have been centered a little to the north...

But if I'm writing this post is because of course it did work, so you can test it online

The integration with any installation is quite straightforward and is clearly documented, the only special thing is that you must get a Google Maps API key, but even that step is very easy.

Go, download it and play with it. For developers its code might have very interesting surprises, I'm not saying that the code is perfect, but I think that it does open the doors to make other plugins and code that previously were thought as "too difficult" (for example handling Flash files with the SWFObject, or being able to show at least a simple textarea to edit comments of PHP code). If you read this code (sorry if there aren't enough comments or everything is a little mixed up for the moment), you might find the bits that you need. And if you find this code useful, please contribute back your own ideas, plugins or why not?, a little donation

 

2008/01/11

CKFinder 1.1, an advanced Ajax File Manager

Today the new version of CKFinder 1.1 has seen the light after some months in development.

This version provides support for Asp and ColdFusion server hosting, provides improved security across all the environments, does bring support for Safari 3 and Opera 9.5 and fixes some little problems with some IE6 installations.

It also introduces the new documentation site for FCKeditor and CKFinder. It is still an ongoing task, but you should be able to find much more info and detailed explanations about how to configure and use these tools, please be gentile if there's something wrong or missing, you should know that developers hate to write documentation and that you must point them with a gun in order to stop coding and start writing in plain English ;-)

What's this CKFinder about?

If you still haven't checked it, CKFinder is a browser based file manager.

Its User Interface is written with HTML and Javascript (buzzword: AJAX) so the client doesn't need any plugin to run it. The new version provides support for the four major engines, as long as you are using a recent enough version. That means: due to marketshare there is support for IE going back to IE 5.5, with Firefox you need 1.5 or newer (or equivalent Gecko browser), Safari 3 does work, and with Opera you need to run the latest beta available for 9.5

On the server side, as I said this version does provide two new languages, so there are four different configurations where you can use it:

  • PHP 4.3 and later
  • IIS with Asp.Net 2.x
  • IIS with classic Asp
  • ColdFusion 6.1 and later, BlueDragon 7.0 and later

With a few lines of code you will be able to add some nice features to your web applications like allowing the users to browse some server folders, upload their files and select them (for inclusion in FCKeditor or any other related situation).

Security and working with different users at the same time has been a main topic since the start of the development, so it's possible to define in a simple file using your server language the way that CKFinder should work, for example:

  • allow non-indentified users to only browse the folders.
  • Users of type "editors" have the ability to upload pictures to the images folder. They have their own folder each one.
  • "Administrator" users are allowed to delete folders and files
  • etc...

All those names and features are just some suggestions that I wrote, you can fine tune the behavior to your specific needs, just site and pick pen and paper, write down the types of users that you need and what should each one of them be allowed to do, and then just configure the CKFinder with that roles and restrictions.

If you just want your registered users to upload some files, and there are no problems with regards to different roles, and you don't need either the abilities to manage uploaded files (renaming, deleting both files and folders), and usage of thumbnails, then the basic filemanager included with FCKeditor might fit your needs.