Namespace CKFinder

Namespace Summary
Constructor Attributes	Constructor Name and Description
	CKFinder The CKFinder class.

Field Summary
Field Attributes	Field Name and Description
<static>	CKFinder._ Private scope.
<static>	CKFinder.config Holds the default configuration settings.
<static>	CKFinder.dialog Dialog window namespace.
<static>	CKFinder.dom CKFinder.dom object.
<static>	CKFinder.env CKFinder.env object.
<static>	CKFinder.lang Contains all loaded translations, use CKFinderAPI.lang instead.
<static>	CKFinder.revision Contains the CKFinder revision number.
<static>	CKFinder.tools CKFinder.tools object.
<static>	CKFinder.version Contains the CKFinder version number.

Method Summary
Method Attributes	Method Name and Description
<static>	CKFinder.addExternalPlugin(names, path, fileName) Registers one or more plugins to be loaded from an external path instead of the core base path.
<static>	CKFinder.addPlugin(name, pluginDefinition, dependencies) Registers a plugin.
<static>	CKFinder.create(basePath, width, height, selectActionFunction, callback) Static "create".
<static>	CKFinder.getPluginPath(name) Returns path to a plugin's folder.
<static>	CKFinder.popup(basePath, width, height, selectActionFunction, callback) Static "popup".
<static>	CKFinder.setPluginLang(pluginName, languageCode, languageEntries) Registers language entries for a specified plugin.
<static>	CKFinder.setupCKEditor(editorObj, config, imageType, flashType) Static "setupCKEditor".
<static>	CKFinder.setupFCKeditor(editorObj, config, imageType, flashType) Static "setupFCKeditor".
	appendTo(elementOrId, config) Creates a new application instance inside a specific DOM element.
	create(config) Renders CKFinder in the current document.
	popup(width, height) Opens CKFinder in a popup.

Namespace Detail

CKFinder

Since: 2.0

The CKFinder class. Use it to integrate CKFinder with your website.

var finder = new CKFinder( { width : 600 } );
finder.basePath = "/ckfinder/";
finder.create();

Parameters:
{Object} config: (Optional) The specific configurations to apply to this CKFinder instance. Configurations set here will override global CKFinder settings.
{Function} callback: (Optional) A function to be called when CKFinder will load. The callback function will be executed after receiving the result of the "Init" command, before loading files/folders from the server.

Field Detail

<static> {Object} CKFinder._

Since: 2.0

Private scope.

<static> {CKFinder.config} CKFinder.config

Since: 2.0

Holds the default configuration settings. Changes to this object are reflected in all CKFinder instances, if not specificaly specified for those instances.

<static> {CKFinder.dialog} CKFinder.dialog

Since: 2.0

Dialog window namespace.

<static> {CKFinder.dom} CKFinder.dom

Since: 2.0

CKFinder.dom object.

<static> {CKFinder.env} CKFinder.env

Since: 2.0

CKFinder.env object.

<static> {Object} CKFinder.lang

Since: 2.0

Contains all loaded translations, use CKFinderAPI.lang instead.

<static> {Number} CKFinder.revision

Since: 2.0.1

Contains the CKFinder revision number. Revision number is incremented automatically after each modification of the CKFinder source code.

alert( CKFinder.revision );  // e.g. '1175'

<static> {CKFinder.tools} CKFinder.tools

Since: 2.0

CKFinder.tools object.

var foo = CKFinder.tools.htmlEncode( "<b>" );
// foo is now &lt;b&gt;

<static> {String} CKFinder.version

Since: 2.0.1

Contains the CKFinder version number.

alert( CKFinder.version );  // e.g. '2.0.1'

Method Detail

<static> {Undefined} CKFinder.addExternalPlugin(names, path, fileName)

Since: 2.0

Registers one or more plugins to be loaded from an external path instead of the core base path.

CKFinder.addExternalPlugin( 'imageresize', '/ckfinder/plugins/imageresize/' );

Parameters:
{String} names: The plugin names, separated by commas.
{String} path: The path of the folder containing the resource.
{String} fileName: The plugin file name. If not provided, the default name is used (plugin.js).

<static> {Undefined} CKFinder.addPlugin(name, pluginDefinition, dependencies)

Since: 2.0

Registers a plugin.
Note: Registered plugins are not loaded automatically, use CKFinder.config.extraPlugins to instruct CKFinder to load a plugin.

// Passing function as a plugin definition.
CKFinder.addPlugin( 'myplugin', function( api ) {
	var toolId = api.addToolPanel( '<h3>My tool</h3><p>Sample content.</p>' );
	api.showTool( toolId );
} );

// Using a "static" create method.
CKFinder.create( { extraPlugins : 'myplugin', basePath : '/ckfinder/' } );

// Passing object as a plugin definition.
CKFinder.addPlugin('basketTest',
{
	basketToolbar :
	[
		[
			'basketToolbarTest',
			{
				label : 'My Basket Button',
				className : 'myBasketButton',
				icon : false,
				onClick : function( api )
				{
					alert( 'toolbar' );
				},
				disableEmpty : true
			}
		]
	],
	basketFileContextMenu :
	[
		[
			'basketMenuTest',
			{
				label : 'My Basket menu item',
				onClick : function()
				{
					alert( 'context menu' );
				},
				group : 'file1'
			}
		]
	],
	connectorInitialized : function( api, xml ) {
		var thumbsUrl = xml.selectSingleNode( 'Connector/ConnectorInfo/@thumbsUrl' );
		// Make sure the thumbsUrl attribute was there.
		if ( thumbsUrl )
			alert( 'Thumbs URL: ' + thumbsUrl.value );
	},
	connectorResponse : function( api, xml ) {
		var nodes = xml.selectNodes( 'Connector/Files' );
		if ( nodes.length )
		{
			nodes = xml.selectNodes( 'Connector/Files/File' );
			var size = 0;
			for ( var i = 0 ; i < nodes.length ; i++ )
				size += parseInt( nodes[i].attributes.getNamedItem( 'size' ).value, 10 );
			alert ( 'Total size of fetched files: ' + size + 'KB' );
		}
	},
	appReady : function( api ) {
		alert( 'appReady: ' + api.lang.FilesLoading );
	},
	galleryCallback : function( api, selected, files ) {
		if ( selected.isImage() )
		{
			alert( 'Showing image named ' + selected.name );
			return true;
		}
		return false;
	},
	uiReady : function( api ) {
		api.addFileContextMenuOption( { label : 'uiReady test', command : "command1" } , function( api, file )
			{
				api.openMsgDialog( '', 'Using uiReady to add an item to file context menu.' );
			});
	},
toolbarButtons :
[
		[
			'MyButton',
			{
				label : 'My Button',
					// Specify "command" or "onClick"
				// command : 'CreateSubFolder',
				onClick : function ( api ) {
					alert( 'CKFinder Id : ' + api.id );
				},
				icon : false
			}
		]
]
});

// You can use the "CKFinder" class to render CKFinder in a page:
var finder = new CKFinder();
finder.extraPlugins = 'basketTest';
finder.basePath = '/ckfinder/';
finder.create();

Parameters:

{String} name

Plugin name.

{Function|Object} pluginDefinition

Plugin definition - a function (where CKFinderAPI is passed as the first argument) or an object.
Supported are the following object properties:

{Function} appReady - (Optional) A callback function that accepts one argument:
- api - CKFinderAPI. All properties of this object should already be set.
Executed when the application is ready to run, before files and folders are loaded.
{Function} connectorInitialized - (Optional) A callback function that accepts two arguments:
- api - CKFinderAPI. All properties of this object should already be set.
- xml - CKFinder.xml Contains information sent by the Init command.
Executed after CKFinder receives information sent by the Init command.
{Function} connectorResponse - (Optional) A callback function that accepts two arguments:
- api - CKFinderAPI. All properties of this object should already be set.
- xml - CKFinder.xml Contains information sent from the connector.
Executed after CKFinder receives information sent by the connector.
{Function} uiReady - (Optional) A callback function that accepts one argument:
- api - CKFinderAPI. Properties of this object are not set as of yet.
{Function} galleryCallback - (Optional) A callback function that runs when the View command is triggered on a file. If it does not return a Boolean true, it falls back to displaying the file in a popup. It accepts three arguments:
- api - CKFinderAPI. Properties of this object are not set as of yet.
- selected - CKFinder.dataTypes.File. The selected file.
- files - {Array}. An array of files contained within the folder, each represented by an instance of CKFinder.dataTypes.File.
{Array} lang - (Optional) An array with language codes, needs to be set if localization files are included in a plugin.
If set, CKFinder will look for a file named languageCode.js (en.js, de.js etc.) in the "lang" subfolder of a plugin.
Example: [ 'en', 'pl' ].
If user language will be different than "en" or "pl", then the default language file will be loaded.
{Array} basketToolbar - (Optional) An array with definitions of extra toolbar buttons inside of the Basket folder. Each definition consists of:
- {String} Unique command name.
- {Object} Button definition:
  - {String} className - (Optional) A CSS class name for this button.
  - {String} label - Button label.
  - {String|Boolean} icon - Path to the button icon. Set to false to disable the icon.
  - {Function} onClick - A callback function to be executed when the button is pressed. CKFinderAPI is passed as the first argument.
  - {Boolean} disableEmpty - (Optional) If set to true, the command will be disabled when the basket is empty.
{Array} basketFileContextMenu - (Optional) An array with definitions of extra file context menu items inside of the Basket folder. Each definition consists of:
- {String} Unique command name.
- {Object} Menu item definition:
  - {String} label - Label displayed to the user.
  - {String} group (Optional) - Group of items to which an item should belong. Default is 'file1'.
  - {Function} onClick - A callback function to be executed when an item is selected. Two parameters are passed:
    - CKFinderAPI CKFinder API object.
    - CKFinder.dataTypes.File Currently selected file.
  - {Boolean} disableEmpty - (Optional) If set to true, the command will be disabled when the basket is empty.
{Array} toolbarButtons - (Optional) An array with definitions of extra toolbar buttons for custom plugin. Each definition consists of:
- {String} Unique button name.
- {Object} Button definition:
  - {String} className - (Optional) A CSS class name for this button.
  - {String} label - Button label.
  - {String|Boolean} icon - Path to the button icon. Set to false to disable the icon.
  - {Function} onClick - A callback function to be executed when the button is pressed. CKFinderAPI is passed as the first argument.
  - {String} command - (Optional) Name of existing CKFinder command to execute with this button.

Order of callback execution when CKFinder loads: uiReady, appReady, connectorInitialized. All callback functions are called only once, during CKFinder startup.

{Array} dependencies

(Optional) Array with plugins required by this plugin (e.g. [ 'tools' ]).

<static> {CKFinderAPI} CKFinder.create(basePath, width, height, selectActionFunction, callback)

Since: 2.0

Static "create". Accepts four arguments to set the most basic properties of CKFinder. It is possible to pass an object with selected properties as the only argument.

  var api = CKFinder.create( '/ckfinder/', '100%', 400 );

  CKFinder.create( { basePath : '/ckfinder/', height : '400' } );

Parameters:
{String|Object} basePath: The URL path to the installation folder of CKFinder (CKFinder.config.basePath) or the configuration object.
{String} width: (Optional) CKFinder width (CKFinder.config.width).
{String} height: (Optional) CKFinder height (CKFinder.config.height).
{Function} selectActionFunction: (Optional) Function to be executed when a file is selected (CKFinder.config.selectActionFunction).
{Function} callback: (Optional) The callback function (CKFinder.config.callback).

Returns:: {CKFinderAPI} Public API.

<static> {String} CKFinder.getPluginPath(name)

Since: 2.0

Returns path to a plugin's folder.

// http://example.com/ckfinder/plugins/imageresize/
alert( CKFinder.getPluginPath( 'imageresize' ) );

Parameters:
{String} name: Plugin name.

Returns:: {String} URL to a plugin's directory.

<static> {CKFinderAPI} CKFinder.popup(basePath, width, height, selectActionFunction, callback)

Since: 2.0

Static "popup". Accepts four arguments to set the most basic properties of CKFinder. It is possible to pass an object with selected properties as the only argument.

  CKFinder.popup( '/ckfinder/', '100%', 400 );

  CKFinder.popup( { basePath : '/ckfinder/', height : '400' } );

Parameters:
{String|Object} basePath: The URL path to the installation folder of CKFinder (CKFinder.config.basePath) or the configuration object.
{String} width: (Optional) The popup window width. Default value is '80%'.
{String} height: (Optional) The popup window height. Default value is '70%'.
{Function} selectActionFunction: (Optional) Function to be executed when a file is selected (CKFinder.config.selectActionFunction).
{Function} callback: (Optional) The callback function (CKFinder.config.callback).

Returns:: {CKFinderAPI} Public API.

<static> {Undefined} CKFinder.setPluginLang(pluginName, languageCode, languageEntries)

Since: 2.0

Registers language entries for a specified plugin. Used only inside the plugin's language files.

CKFinder.setPluginLang( 'dummy', 'en',
{
	dummy :
	{
		title : 'Dummy dialog',
		menuItem : 'Open dummy dialog',
		typeText : 'Please type some text.'
	}
});

Parameters:
{String} pluginName: Name of the plugin.
{String} languageCode: Language code.
{Object} languageEntries: Language entries.

<static> {Undefined} CKFinder.setupCKEditor(editorObj, config, imageType, flashType)

Since: 2.0

Static "setupCKEditor". If the editorObj is null, then CKFinder will integrate with all CKEditor instances.

var editor = CKEDITOR.replace( 'editor1' );
editor.setData( '<p>Test.</p>' );
CKFinder.setupCKEditor( editor, '/ckfinder/' ) ;

var editor = CKEDITOR.replace( 'editor1' );
editor.setData( '<p>Test.</p>' );
CKFinder.setupCKEditor( editor, { basePath : '/ckfinder/', skin : 'v1' } ) ;

// Integrate with all existing and future CKEditor instances.
CKFinder.setupCKEditor( null, { basePath : '/ckfinder/', skin : 'v1' } ) ;
CKEDITOR.replace( 'editor1' );

Parameters:
{Object} editorObj: CKEditor instance. If editorObj is null, CKFinder will integrate with all CKEditor instances.
{Object|String} config: Object with selected configuration options. Alternatively, it might be just the basePath to CKFinder installation.
{String} imageType: Name of the resource type that should be used when CKFinder is launched from the Image dialog window. Default is "Images".
{String} flashType: Name of the resource type that should be used when CKFinder is launched from the Flash dialog window. Default is "Flash".

<static> {Undefined} CKFinder.setupFCKeditor(editorObj, config, imageType, flashType)

Since: 2.0

Static "setupFCKeditor". It is possible to pass an object with selected properties as a second argument.

var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.BasePath	= '/fckeditor/' ;
oFCKeditor.Value	= '<p>Testing.</p>' ;
CKFinder.setupFCKeditor( oFCKeditor, '../' ) ;
oFCKeditor.Create() ;

Parameters:
{Object} editorObj: The FCKeditor instance.
{Object|String} config: Object with selected configuration options. Alternatively, it might be just the basePath to the CKFinder installation.
{String} imageType: Name of the resource type that should be used when CKFinder is launched from the Image dialog window. Default is "Images".
{String} flashType: Name of the resource type that should be used when CKFinder is launched from the Flash dialog window. Default is "Flash".

{CKFinderAPI} appendTo(elementOrId, config)

Since: 2.0

Creates a new application instance inside a specific DOM element.

var finder = new CKFinder();
finder.basePath = "/ckfinder/";
// Append CKFinder to <div id="container">
finder.appendTo( "container" );

Parameters:
{Object|String} elementOrId: The DOM element or its ID.
{Object} config Optional: The specific configurations to apply to this application instance. Configurations set here will override global CKFinder settings.

Returns:: {CKFinderAPI} Public API.

{CKFinderAPI} create(config)

Since: 2.0

Renders CKFinder in the current document.

var finder = new CKFinder();
finder.basePath = "/ckfinder/";
var api = finder.create();

Parameters:
{Object} config Optional: The specific configurations to apply to this application instance. Configurations set here will override global CKFinder settings.

Returns:: {CKFinderAPI} Public API.

{CKFinderAPI} popup(width, height)

Since: 2.0

Opens CKFinder in a popup. Accepts two basic parameters "width" and "height" set as numbers (pixels) or percent (of screen size) values. It is also possible to pass object with four properties as the only argument. These properties are: width, height, popupTitle, popupFeatures.

var finder = new CKFinder();
finder.basePath = "/ckfinder/";
finder.popup( 600, 480 );

var finder = new CKFinder();
finder.basePath = "/ckfinder/";
finder.popup( { width : 600, height : 480, popupTitle : 'CKFinder Popup', popupFeatures : 'menubar=yes,modal=yes' } );

Parameters:
{String|Object} width: The popup window width or the configuration object. If width is used the default value is '80%'.
{String} height: The popup window height. Default value is '70%'.

Returns:: {CKFinderAPI} Public API.

See:: CKFinder.config.popupTitle; CKFinder.config.popupFeatures

CKFinder 2 JavaScript API Documentation

Namespaces

Classes

Namespace CKFinder