Announcing new module: GBFilePicker

[NaN]

Hello there,

as i mentioned somewhere in this topic someday the built in filepicker of AdvancedContent will be replaced by an external module. But unfortunately all the promising filepicker or filebrowser pojects are not ready to go yet.
Since sometimes i really can be an annoying impatient person i extracted the filepicker from AdvancedContent (again - because actually it already was an extraction of the TinyMCE filepicker) and created a standalone module of it.
The result is a little tool for module developers or webdesingers: GBFilePicker

Module developers can integrate filebrowsing (or just a simple filedropdown), including some fileoperations like create dirs, delete dirs, upload files or delete files using the GBFilePicker API function CreateFilePickerInput(). For more details see the examples in the module help. There also is a tiny API documentation that is included in the download and can be found in the dir doc/api or using the link in the module help.
Use with caution when used in fontend modules.
Frontend usage is not recommended at the moment due to security.

Webdesigners can use the {content_module} tag in their page templates to provide filepicker inputs that acts like content blocks.
As mentioned above due to security there is no default frontend function at the moment.
But maybe this comes later.

The module is always restricted to the uploads dir.
You can access any folder in your uploads dir.
With params you can control if users may browse through subdirs, may upload files etc.

Since this is the first beta version you will miss some features like the module settings in backend or customizing the output. But this will be integrated as soon as possible.
(At least all these filepicker settings you might already know from AdvancedContent will be in version 1.1. Customisable templates may follow in later versions.)

Have fun with this and please report any kind of feedback.

Regards, NaN.

[NaN]

I uploaded a new version with some bugfixes.
Notice that you cannot use this module with {content_module} tag if whitespaces are in the parameter "block". There seems to be an issue with {content_module} and whitespaces. Anyway the param block should be handled more like a varname not like a label. For labeling the content blocks use the param "label".

[KO]

Sounds interesting. Any plans to add multiple file upload to this module? I believe html5 spec brings something new on that.

[alexbuckland]

AWESOME. Havnt tried it yet but it sounds like its something Ive been waiting on for a while. Will defo give it a try for the next project.

[NaN]

Thanks for your feedbacks.

Multiple file upload would be nice.
But to be honest i don't have any clue about html5 :/
(I should do some homework ... )
This module is actually not meant to be a real file management tool.
But i will at least think about that.
Anyway i planned to add some bulk actions (e.g. select multiple files) so why not also multiple file upload.

We will see ...

[NaN]

Just some notice:

The module requires jQuery and jQuery form plugin. But it is not neccessary to put them in your template or to make sure that nothing is loaded twice. The scripts are loaded dynamically.

When the output is rendered the module first checks if jQuery is already available (it waits a random value of 1-3s and while waiting it checks all 100-200ms again). If time is up and there is no jQuery it inserts the link to the scripts in the head section itself and then waits again until jQuery and form plugin are available.
This is why you will see a loading icon for a while until the filepicker is ready to be used.

So you don't need to be worried about loading jQuery or jQuery plugins twice.
If you already have it in your template the filepicker does not load it again and just uses the available libaries. But this may need some more testing (especially in environments of massive js usage).

[KO]

yeah multiple upload would be nice And when you have that challenge done and you feel bored then next is Drag and Drop from desktop.

Look here.. http://www.thecssninja.com/javascript/d ... rop-upload
or .. http://www.appelsiini.net/2009/10/html5 ... ile-upload

I believe not many CMS systems does this at the moment. Ofcourse it's limited to only certain browsers but for backend handling of images like that would be killer.

BTW. Great work with AdvancedContent! That's what Content should be.

[NaN]

New version 1.1 is out.
Just minor bugfixes and improvements but heavy changes to the API function CreateFilePickerInput().
Read help and API doc for more details.

Notice: the param "file_type" has been changed to "media_type".

There is a css issue with IE that i was too lazy to fix.
If anyone has a clue why the background images, input fields, borders and font-color in IE are creating "holes" in the filebrowser so that you can see the admin panel trough it please let me know.
(has something to do with opacity and z-index iguess)

Edit:
There was a minor JS issue that caused the GBFilePicker to not work with AdvancedContent and a CSS issue that caused preview images not to be shown in backend after page has been saved and reloaded.
Did not want to release a new version because of this and just reuploaded v. 1.1 again.
So if anyone downloaded 1.1 before 2010-09-29 please just download again.

[Cerulean]

This is a fantastic module! I love the way you can resize images on upload.
What would be even better is if it was accessible in TinyMCE, via the Insert Image and Link dialogs. Any plans to extend it in that direction?

[NaN]

No need to do so (imho), because it bases on the default TinyMCE insert image plugin
Plan was to provide this function also to other modules.
Anyway i'm glad you like it

[Cerulean]

NaN - the Insert Image dialogs I get in TinyMCE are very different in appearance and functionality: in particular I'm missing the ability to upload and resize images. Please see the screenshots below.

Is there a setting or plugin in TinyMCE that I need to activate to get the kind of functionality you've included in GBFileFicker?

[Cerulean]

Okay, should have looked more closely - have discovered how to activate the upload functionality.

But still missing the resizing option, which is highly desirable as otherwise you get the perennial problem of users inserting 4mb images into the content. The image can be scaled down by H and W values from TinyMCE, but is not actually resized.

I know the Image Manager can resize images, but it's not handy to the user while they are editing a page.

NaN, do you know of a way to get genuinely resized images into a {content} block?
Thanks for your help.

[JeremyBASS]

@cerulean  Look into supersizer plugin and look to the forum post about putting it on the upload event.. that will take a 4mb (if php memory limit will let) and size the original down to what you want.. like a 200kb 2000x2000 px or something.. it's the overwrite param.. hth.. cheers –jeremy

[NaN]

In TnyMCE Settings there also is an option to resize images on upload.
There are almost the same settings like in GBFilePicker.
Trust me, i've just copied it from TinyMCE.
It must be there.

(see screenshots)

[Cerulean]

NaN, you are so right...
I had tried enabling "on-the-fly resizing" earlier but it didn't do anything because the "Show filemanagement options" checkbox wasn't ticked.
So happy to have that sorted

Jeremy, thanks for letting me know about SuperSizer - it would be great to manipulate the output of TinyMCE with this plugin. Will follow up soon in the SuperSizer thread.