resizing and rotating in FCKeditor

On the heels of yesterday’s work, I’ve added some further features to the file manager.

Some of our clients upload images from their cameras, only to realise they took the images with the camera tilted 90 degrees to either side. So, we have a new Rotate function.

Also, a resize function has been added, for reducing the size of images that you accidentally uploaded too large.

I rewrote the code to use GD instead of Pear, as the Pear library was giving some people trouble (and the Rotate function in Image_Transform produces cack results).

Also, I’ve added some icons.

the example – click the Image icon, then click “Browse Server”.

28 Comments.

  1. Arjan Schrijver

    This is even better than yesterday’s post! 🙂
    Is your work publicly available?

  2. my patches are free for use. I guess they fall under whatever license FCKeditor has. If you have any problems getting this working with your own server, please tell me.

  3. Well… You didn’t put up a link to the latest patches which include the image resizer. (or am I just blind?)

  4. Great patch, works very well with FCKEditor. I have spent a bit of time trying to get it to work with TinyFCK – http://p4a.sourceforge.net/tinyfck – though which uses the filemanager part of FCKEditor. Alas to no avail. The filemanager in TinyFCK has a different directory structure but substituting the appropriate files didn’t seem to work. The filemanager opens and the popup window works on mouseover but there is no thumbnail and when the file is clicked nothing happens i.e. it is not downloaded to, for example, the edit/insert graphics window. Any ideas how the patch could be adapted?

  5. opoc, part of that question seems to have been asked very recently in the TinyFCK forums: http://sourceforge.net/forum/forum.php?thread_id=1477816&forum_id=528776

    As for the thumbnail not appearing – the scripts require GD, and also write permissions (to create a .thumbs directory) for the server. I suppose I should really have written a bit more error-checking into it 😉

  6. Thumbs work perfectly when actually using FCK editor rather than TinyFCK, so GD and permissions are OK. I will investigate the link you provided thank you.

    kind regards

  7. I really like this “enhancement”!
    The preview thumbnail is working for me, but I only don’t seem to be able to rotate an image, delete it, or rename it.
    Folder permissions are set to 777, so that won’t be the problem I guess.
    Does anyone have a clue?

  8. that’s strange. the fact that the preview is created means that images can be created. the rotation is handled by the same engine.

    renaming and deleting are handled by PHP’s built-in functions.

    this couldn’t possibly be a caching issue in your browser? (reaching…)

  9. I tried both in Internet Explorer and FireFox…

  10. I am interesting to get FCK Editor for mos 4.5 1.09 with image resize and colour depth reduced to 256 colours. Or any other editor with such features, I am willing to pay a small fee for it, but I want to use it for free on more sites on diferent servers.

    Can somebody help me to get such editor?

  11. Jovan – if you mean the icons, I am sure you can find a low-colour set through fckeditor.net, and if not, then try the sourceforge forum.

    As for the image resizing – The code I wrote resizes using true-colour, in order to get as much quality as possible, but the input and output colour depths should match whatever you give it, so if you give it a .gif, for instance, it should resize okay, and spit out a resized .gif at the end.

    Feel free to use my code.

  12. Great work!! I just have one problem. The filemanager with all of its function works very well as long as I run it on my localhost. But on the webserver if I create a new directory, uploading files is not possible (but no error message). The folder permissions are set correctly to 0777 (as I can see via my FTP client). The strange thing is, if I create the directory with the FTP client, it works…

    Additionally, no thumbs are display on mouseover – no matter if the files are already uploaded or if they’re new. But the .thumbs folder is created and the thumb images, too.

    I guess it’s a server issue – but I have no idea which settings have to be changed. Does anybody know a possible solution?

  13. thanks Stefan.

    to your question; dunno!

    I’d recommend you try using my newer file manager instead – KFM (Kae’s File Manager). It’s a bit better than the one this article was about.

  14. Thank you, Kae.

    Unfortuantely the new version’s demo didn’t work on my IE (the selected file wasn’t transfered to the FCKEditor).

    I guess the problem on my server is caused be the safe mode settings. Safe mode is enabled and although I can create folders, file upload is not possible. I tested it on another server with safe mode = off and it worked. So I asked my system administrator to disable safe mode and I hope he’ll do that! 😉

  15. I did notice a problem with the current “stable” version, but you could try the “bleeding edge” demo.

    never tried safe mode myself, so I can’t comment on whether it would work or not.

  16. Hey Kae,

    Your features are really sweet, but the link to the files is dead. Can you tell me where i can find the files now?

    Thanks! Great job!

  17. Michael, I’m not sure I even have a copy of the fckeditor file manager files any more.

    If you’re really interested in a solution, I would definitely recommend my KFM project (http://kfm.verens.com/).
    It reached version 0.6.2 today, and is mostly stable. As long as your server supports PHP and SQLite, you should have no problems. If you don’t support SQLite (and why not??), version 0.5 is probably what you need.

  18. Hey Kae,

    Thanks for your answer.

    If I click “the example” above, FCKeditor appears. When I click the image button the file manager appears with a “preview” of the image I hover on, together with some options like resize and rotate. I didn’t see that on FCKeditor before, I thought that was the part you added to FCK. Anyway, that’s what I need. 🙂

    I’ll check out your project, but is it possible to give me a link to those files? Or can it be found in your project files?

  19. Michael, yes – the image preview is code that I added. I don’t recommend using that code, though, as there is a fundamental problem with the method I used to do it, which can cause the filemanager to break if too large an image is uploaded.

    KFM, on the other hand, displays your images as thumbnails, similar to how your windows, kde or gnome file manager would show them. This way you see all of your images all of the time.

  20. on the question of where the hell has the code gone anyway – I’ll dig it up tomorrow morning. Watch this space.

  21. Hi,
    please can you send me that code for resize? or leave a link-url here? many thanks.

  22. sorry for the delay on this – I’ve had a lot on my plate recently. What I’ve done is to zip up the /editor/filemanager directory. the zips are available here (tar bz2 (36k), zip (67k)).

    again, though, I urge you to not use it – there are some problems with it, and I won’t be fixing them. Instead, use KFM (KFM) – that project has more than just myself working on it constantly, so it’s only going to get better.

  23. Thanks for your work 😉

  24. Which part of FCKeditor I have to replaced if I want to use delete/resize add on in my FCKeditor 2.3 on Drupal? Thanx

  25. I’ve zipped up the /editor/filemanager directory. the zip is available here.

    I urge you to NOT use it – there are some problems with it, and I WILL NOT be fixing them. Instead, use KFM.

  26. I stumbled across this today, absolutly what I was looking for, but I have 1 question.

    what do I need to change to increase the thumbnail size?

    I want the thumbnails to be 2x what they are on the mouseover.

  27. I do not support this hack anymore. Please use KFM instead. With KFM, you can return thumbnails of any size at all to the CMS.

%d bloggers like this: