elfinder

Extension to use elFinder file manager in yii application
17 followers

This extension allows use elFinder file manager in your Yii application. Possible usage:

  • chose file on server side (ServerFileInput widget)
  • manage files in specified folder (ElFinder widget)
  • add file browser to tinyMce wysiwyg editor

Requirements

Tested with Yii 1.1.10, but should work with previous versions too

Usage

  1. Checkout source code to your project, for example to ext.elFinder
  2. Create controller for connector action, and configure it params
  3. ServerFileInput - use this widget to choose file on server using ElFinder pop-up
  4. ElFinderWidget use this widget to manage files
  5. To use TinyMceElFinder see: My TinyMce extension
// controller to host connector action
class ElfinderController extends CController
{
    public function actions()
    {
        return array(
            'connector' => array(
                'class' => 'ext.elFinder.ElFinderConnectorAction',
                'settings' => array(
                    'root' => Yii::getPathOfAlias('webroot') . '/uploads/',
                    'URL' => Yii::app()->baseUrl . '/uploads/',
                    'rootAlias' => 'Home',
                    'mimeDetect' => 'none'
                )
            ),
        );
    }
}
 
//server file input
$this->widget('ext.elFinder.ServerFileInput', array(
        'model' => $model,
        'attribute' => 'serverFile',
        'connectorRoute' => 'admin/elfinder/connector',
        )
);
 
// ElFinder widget
$this->widget('ext.elFinder.ElFinderWidget', array(
        'connectorRoute' => 'admin/elfinder/connector',
        )
);

Changelog

  • January 16, 2013 Fixed jQuery 1.8.3 compatibility, added CSRF validation support, added i18n support, begin using compressed script when not debugging
  • August 14, 2012 Fixed bug with upload(from comments here)
  • July 18, 2012 Adding support for multiple ServerFileInput instances with different connectors

Resources

Total 18 comments

#13481 report it
Bogdan Savluk at 2013/05/31 03:54am
Re: migrate to yii2

Not yet, I think before doing this we need to wait at least for the alpha version.

#13480 report it
PinkBrainPlan at 2013/05/31 01:43am
migrate to yii2

Hi, are you already working on a yii2 version of this extension?

Would be cool to know, as I would love to use this extension in my new "internal" intranet site...

#12384 report it
v_bogdan at 2013/03/17 01:43pm
How can i add zip/unzip button to panel

there are no those buttons. Check it out. I was donwload last version of ext. and i has no change any files.

#12382 report it
Bogdan Savluk at 2013/03/17 12:22pm
Re: How can i add zip/unzip button to panel?

There is settings property where you can override default widget settings, you can read more about these options here: https://github.com/Studio-42/elFinder/wiki/elFinder-1.x#client-configuration

But as I remember, by default, there is all avaliable buttons on toolbar, so - in order to add these buttons to toolbar probably you will need to modify elFinder scripts.

#12376 report it
v_bogdan at 2013/03/17 10:03am
zip/unzip

How can i add zip/unzip button to panel?

#9169 report it
natb19 at 2012/07/25 06:35pm
A problem on Host server

Everything worked great locally, but on upload to the server (PHP Version 5.2.17, Linux) I had a connector problem.

On inspecting the response I got the following error:

PHP Error [2]
 
array_keys() [function.array-keys]: The first argument should be an array (pathtofile/protected/extensions/elFinder/php/elFinder.class.php:325)

I had to edit the line to: (adding the &&count($this->_options['archivers'])>0)

if (isset($this->_commands['extract'])&&count($this->_options['archivers'])>0) {

which solved it. (I know this is a elFinder core problem, but I wanted you guys to have the solution at hand if you ran into the same problem :)

#9084 report it
Bogdan Savluk at 2012/07/18 06:05am
Re: Adding support for multiple instances with different connectors

Added your changes to extension

#9079 report it
natb19 at 2012/07/18 03:49am
Adding support for multiple instances with different connectors

Not sure if there was a supported way to do this, but I wanted several fields using elFinder on the same page. Unfortunately, only the last widget's connector path was used, which messes things up if your multiple fields require different locations on your server (and the other settings that you can set in the connector). So...

I've edited the ServerFileInput.php to change how the javascript is rendered on the page. In this file find the run() method and swap out the following code: (starts at line 80)

$script = <<<EOD
        window.elfinderBrowse = function(field_id, connector) {
            var aFieldId = field_id, aWin = this;
            if($("#elFinderBrowser").length == 0) {
                $("body").append($("<div/>").attr("id", "elFinderBrowser"));
                var settings = $settings;
                settings["url"] = connector;
                $("#elFinderBrowser").elfinder(settings);
            }
            else {
                $("#elFinderBrowser").elfinder("open", connector);
            }
        }
EOD;
        $cs = Yii::app()->getClientScript();
        $cs->registerScript('ServerFileInput#global', $script);
 
        $js = //'$("#'.$id.'").focus(function(){window.elfinderBrowse("'.$name.'")});'.
            '$("#' . $id . 'browse").click(function(){window.elfinderBrowse("' . $id . '", "'.$connectorUrl.'")});';

For noobs (including myself) who didn't know you can include multiple settings in the single connector controller e.g.

class ElfinderController extends CController
{
    public function actions()
    {
        return array(
            'connector' => array(
                'class' => 'ext.elFinder.ElFinderConnectorAction',
                'settings' => array(
                    'root' => Yii::getPathOfAlias('webroot') . '/images/',
                    'URL' => '',
                    'rootAlias' => 'Image',
                    'mimeDetect' => 'none'
                )
            ),
            'mediaconnector' => array(
                'class' => 'ext.elFinder.ElFinderConnectorAction',
                'settings' => array(
                    'root' => Yii::getPathOfAlias('webroot') . '/media/',
                    'URL' => '',
                    'rootAlias' => 'Media',
                    'mimeDetect' => 'none'
                )
            ),
        );
    }
}
#9037 report it
Bogdan Savluk at 2012/07/15 01:26pm
Re: CSRF

About where to place meta-tags

Place that code in head tag of html page(maybe it is in your layout)

About elfinder 2.x

As I seen elFinder in general was rewrited in 2.x branch, so there are many new features and new interface. I have made it integration as separate widget, and - it works ok.

Also I have started work on integration with TinyMCE, and there is one problem - now elFinder has no option to open in modal dialogue. So we need to open it in iframe(as described in elFinder wiki about integration with tinyMCE) or write code to properly open it in modal dialogue. About opening it in iframe - at my mind it is too ugly(i have tried and do not like this at all), most ugliest thing in it - is modal dialogues opened from elFinder within iframe. About second one - in my current realization it also looks bad.

So, because I have no need in new features right now, I decided do not continue developing extension for elFinder 2.x until official release. Or until i have more free time for this.

Anyway I have published it here: elFinder 2.x on bitbucket . So you can try it.

#9036 report it
havier at 2012/07/15 11:57am
CSRF

Sorry for my ignorance, where exactly i need introduce this code? "page header", i have a "actionAdmin" on controller an view "admin" where i show elFinder.

Another question, for what you didnt introduce new version of elFinder?, is on RC1. Is easy to change to version 2?

#9030 report it
Bogdan Savluk at 2012/07/14 10:48am
Re: CSRF problem

In elFinder source code I have found support for "Rails csrf meta tag". So you can add Yii CSRF token to elFinder using the same meta tags:

//place this in your page header
$request=Yii::app()->request;
if($request->enableCsrfValidation){
   echo CHtml::metaTag($request->csrfTokenName,'csrf-token');
   echo CHtml::metaTag($request->getCsrfToken(),'csrf-param');
}
#9028 report it
havier at 2012/07/14 04:45am
CSRF Problem

Thanks for this great extension.

When i have active CSRF, i cant upload files. some one knows how resolve this problem?

Thanks.

#9022 report it
Bogdan Savluk at 2012/07/13 07:03am
re: $model->icon is not file field - it is text field with file url on server

No, because file selected in this widget already on server, widget is only to pick file url on server. You can save this url for use in your app. Also according to your connector cofiguration you can get file path on server and for example copy it somewhere.

#9020 report it
yatskanich.sasha at 2012/07/13 04:32am
$model->icon is not file field - it is text field with file url on server

As i understood this widget insert text field in form. Can i change it to file field?

#9019 report it
Bogdan Savluk at 2012/07/13 04:03am
Re: can't take file by CUploadedFile::getInstance

This is because $model->icon is not file field - it is text field with file url on server.

#9017 report it
yatskanich.sasha at 2012/07/13 03:00am
can't take file by CUploadedFile::getInstance

Ok i have configure widget and it's work very well, but i can't take file by CUploadedFile::getInstance, when i write in controller: $model->icon=CUploadedFile::getInstance($model,'icon'); - i get "null"

this is widget: $this->widget('ext.elFinder.ServerFileInput', array( 'model' => $model, 'attribute' => 'icon', 'connectorRoute' => '/elfinder/connector', ) );

#8980 report it
Bogdan Savluk at 2012/07/11 09:12am
Re: I can not adjust

Check connectorRoute passed to widget: is “connector” action properly configured? “uploads” directory exists and is writable for webserver process? (your can read more about connector options in elFinder 1.x wiki).

Also, if something wrong in backend configuration options(connectorRoute to which is passed), you can see server response in network tab with chrome developer tools(or in something similar, with tools, what you are using) - it can be very helpfull to determine problem which you has.

#8975 report it
yatskanich.sasha at 2012/07/11 04:02am
I can not adjust

I installed your extension, but when I click "choose file" I get the message: Unable to connect to backend!. What I missed?

Leave a comment

Please to leave your comment.

Create extension