-
Notifications
You must be signed in to change notification settings - Fork 1.4k
Client configuration options
This is a list of the available options for elFinder client (javascript) part, along with their default values. Options are specified by passing an object with certain properties into the first argument of $.elfinder()
. Example:
var options = {
url : 'php/connector.php',
lang : 'en'
}
$('#elfinder').elfinder(options);
Note: This page is in progress and as such will not list everything. For more options and further documentation, see inside the js/elFinder.options.js
file.
- url - Connector URL
- lang - The interface lang to use
- customData - Data to append to all requests and to upload files
- cssClass - Additional css class for filemanager node
- rememberLastDir - Remeber last opened dir to open it after reload or in next session
- onlyMimes - Display only certain files based on their mime type
- validName - Used to validate file names
- sort - How to sort files in a directory view
- sortDirect - Sort order
- width - The width of the elFinder main interface
- height - The height of the elFinder main interface (in pixels)
- clientFormatDate - Format dates using client
- UTCDate - Show datetime in UTC timezone
- dateFormat - File modification datetime format
- fancyDateFormat - File modification datetime format for last two days (today, yesterday)
- commands - Active commands list
- commandsOptions - Commands options used to interact with external callbacks, editors, plugins
- getFileCallback - Callback function for "getfile" command
- handlers - Event listeners to bind on elFinder init
- ui - UI plugins to load
- uiOptions - Specifies the configuration for the elFinder UI
- contextmenu - The configuration for the right-click context menu
- resizable - Whether or not the elFinder interface will be resizable
- notifyDelay - Timeout before open notifications dialogs
- dragUploadAllow - Allow to drag and drop to upload files
- allowShortcuts - Allow shortcuts
- loadTmbs - Amount of thumbnails to create per one request
- showFiles - Lazy load
- showThreshold - Lazy load
- requestType - The AJAX request type
- urlUpload - Separate URL to upload file to
- iframeTimeout - Timeout for upload using iframe
- sync - Sync content by refreshing cwd every N seconds
- cookie - Cookie option for browsers that does not support localStorage
- debug - Debug config
Connector URL. This is the only required option. Can be absolute or relative
Data type: string
Default value: ''
The interface lang to use. Can currently be one of the following: ar
, bg
, ca
, cs
, de
, en
, es
, fr
, hu
, jp
, nl
, pl
, pt_BR
, ru
, zh_CN
. You will also need to include corresponding language file from js/i18n
directory.
Data type: string
Default value: 'en'
Data to append to all requests and to upload files. These can be any extra data that must be passed to the connector script. For example, you could use these to pass authentication information.
Data type: object
Default value: {}
Additional css class for filemanager node. This will be applied to the main filemanager container.
Data type: string
Default value: ''
Remeber last opened dir to open it after reload or in next session. This is stored in browser cookie.
Data type: boolean
Default value: true
Display only certain files based on their mime type.
Data type: array
Default value: []
Example:
onlyMimes: ["image"] // display all images
onlyMimes: ["image/png", "application/x-shockwave-flash"] // display png and flash
Used to validate file names. By default, no empty names or '..' allowed.
Data type: boolean, regexp, or function
Default value: false
Example:
// disable names with spaces
validName: /^[^\s]$/
How to sort files in a directory view.
Data type: string
Default value: nameDirsFirst
Available options:
'nameDirsFirst'
- sort by name, directory first
'kindDirsFirst'
- sort by kind, name, directory first
'sizeDirsFirst'
- sort by size, name, directory first
'name'
- sort by name
'kind'
- sort by kind, name
'size'
- sort by size, name
Sort order.
Data type: string
Default value: 'asc'
Available options:
'asc'
- ascent sorting
'desc'
- descent sorting
The width of the elFinder main interface.
Data type: string or number
Default value: 'auto'
Available options: Can be the string 'auto'
or any number measurement (in pixels).
The height of the elFinder main interface (in pixels).
Data type: number
Default value: 400
Format dates using client. If set to false - backend date format will be used.
Data type: boolean
Default value: true
Show datetime in UTC timezone. Requires clientFormatDate
set to true
.
Data type: boolean
Default value: false
File modification datetime format. Value from selected language is used by default.
Set format here to overwrite it. Format is set in PHP date maner
Data type: String
Default value: ''
Example: dateFormat : 'M d, Y h:i A'
will return Mar 13, 2012 05:27 PM
File modification datetime format for last two days (today, yesterday).
Same syntax as for dateFormat
. Use $1
for "Today" and "Yesterday" placeholder.
Data type: String
Default value: ''
Example: fancyDateFormat : '$1 H:m:i'
will return Today 21:59:34
Active commands list. You can set any list of enabled commands here if some minimal required commands will be missed here, elFinder will add them to list automatically.
Data type: array
Default value:
commands : [
'open', 'reload', 'home', 'up', 'back', 'forward', 'getfile', 'quicklook',
'download', 'rm', 'duplicate', 'rename', 'mkdir', 'mkfile', 'upload', 'copy',
'cut', 'paste', 'edit', 'extract', 'archive', 'search', 'info', 'view', 'help',
'resize', 'sort'
]
Commands options used to interact with external callbacks, editors, plugins.
Data type: object
Default value:
commandsOptions : {
// configure value for "getFileCallback" used for editor integration
getfile : {
// send only URL or URL+path if false
onlyURL : true,
// allow to return multiple files info
multiple : false,
// allow to return folders info
folders : false,
// action after callback (close/destroy)
oncomplete : ''
},
// "upload" command options.
upload : {
ui : 'uploadbutton'
},
// "quicklook" command options. For additional extensions
quicklook : {
autoplay : true,
jplayer : 'extensions/jplayer'
},
// configure custom editor for file editing command
edit : {
// list of allowed mimetypes to edit
// if empty - any text files can be edited
mimes : [],
// edit files in wysisyg's
editors : [
// {
// /**
// * files mimetypes allowed to edit in current wysisyg
// * @type Array
// */
// mimes : ['text/html'],
// /**
// * Called when "edit" dialog loaded.
// * Place to init wysisyg.
// * Can return wysisyg instance
// *
// * @param DOMElement textarea node
// * @return Object
// */
// load : function(textarea) { },
// /**
// * Called before "edit" dialog closed.
// * Place to destroy wysisyg instance.
// *
// * @param DOMElement textarea node
// * @param Object wysisyg instance (if was returned by "load" callback)
// * @return void
// */
// close : function(textarea, instance) { },
// /**
// * Called before file content send to backend.
// * Place to update textarea content if needed.
// *
// * @param DOMElement textarea node
// * @param Object wysisyg instance (if was returned by "load" callback)
// * @return void
// */
// save : function(textarea, editor) {}
//
// }
]
},
// help dialog tabs
help : { view : ['about', 'shortcuts', 'help'] }
}
For more info how to use edit
options refer Using custom editor to edit files within elFinder
Callback function for "getfile" command. Required to use elFinder with WYSIWYG editors, external callbacks.
For more info how to use this function refer to wiki WYSIWYG integrations examples.
Data type: function
Default value: null
(command not active)
Event listeners to bind on elFinder init.
TODO: need list of possible handlers
Data type: object
Default value: {}
Example:
handlers : {
upload : function(event) { console.log(event.data); },
open : function(event) { console.log(event.data); }
}
UI plugins to load. Currently dir
, ui
, and dialogs
loads always.
Data type: array
Default value: ['toolbar', 'places', 'tree', 'path', 'stat']
Specifies the configuration for the elFinder UI.
Data type: object
Default value:
uiOptions : {
// toolbar configuration
toolbar : [
['back', 'forward'],
// ['reload'],
// ['home', 'up'],
['mkdir', 'mkfile', 'upload'],
['open', 'download', 'getfile'],
['info'],
['quicklook'],
['copy', 'cut', 'paste'],
['rm'],
['duplicate', 'rename', 'edit', 'resize'],
['extract', 'archive'],
['search'],
['view'],
['help']
],
// directories tree options
tree : {
// expand current root on init
openRootOnLoad : true,
// auto load current dir parents
syncTree : true
},
// navbar options
navbar : {
minWidth : 150,
maxWidth : 500
}
}
The configuration for the right-click context menu. Need some better documentation on this.
Default value:
contextmenu : {
// navbarfolder menu
navbar : ['open', '|', 'copy', 'cut', 'paste', 'duplicate', '|', 'rm', '|', 'info'],
// current directory menu
cwd : ['reload', 'back', '|', 'upload', 'mkdir', 'mkfile', 'paste', '|', 'info'],
// current directory file menu
files : [
'getfile', '|','open', 'quicklook', '|', 'download', '|', 'copy', 'cut', 'paste', 'duplicate', '|',
'rm', '|', 'edit', 'rename', 'resize', '|', 'archive', 'extract', '|', 'info'
]
},
Whether or not the elFinder interface will be resizable. This only works if jQuery UI has the resizable
plugin loaded.
Data type: boolean
Default value: true
Timeout before open notifications dialogs.
Data type: number
Default value: 500
(0.5 second)
Allow to drag and drop to upload files.
Data type: string
Default value: 'auto'
Allow shortcuts
Data type: boolean
Default value: true
Amount of thumbnails to create per one request
Data type: number
Default value: 5
Lazy load. Amount of files display at once.
Data type: number
Default value: 30
Lazy load. Distance in px to cwd bottom edge to start displaying files.
Data type: number
Default value: 50
The AJAX request type. Available choices are post
and get
.
Data type: string
Default value: 'get'
Separate URL to upload file to. If not set - connector URL will be used.
Data type: string
Default value: ''
Timeout for upload using iframe.
Data type: number
Default value: 0
(no timeout)
Sync content by refreshing cwd every N seconds.
todo: fix it, probably broken.
Data type: number
Default value: 0
(do not sync)
Cookie option for browsers that does not support localStorage
Data type: object
Default value:
cookie : {
expires : 30,
domain : '',
path : '/',
secure : false
}
Debug config
Data type: array or boolean
Default value:
debug : ['error', 'warning', 'event-destroy']