Initial commit4.5.6

author: Ismaël Bouya <ismael.bouya@normalesup.org> 2016-01-25 17:45:33 +0100
committer: Ismaël Bouya <ismael.bouya@normalesup.org> 2016-01-25 18:00:33 +0100
commit: 7adcb81e4f83f98c468889aaa5a85558ba88c770 (patch)
tree: 0d6ede733777b29060b48df4afaa2c64bfbae276 /sources/plugins/filebrowser
download: connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.tar.gz
connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.tar.zst
connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.zip
1 files changed, 573 insertions, 0 deletions
diff --git a/sources/plugins/filebrowser/plugin.js b/sources/plugins/filebrowser/plugin.js
new file mode 100644
index 00000000..1fd9f22e
--- /dev/null
+++ b/sources/plugins/filebrowser/plugin.js
@@ -0,0 +1,573 @@
+/**
+ * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or http://ckeditor.com/license
+ */
+/**
+ * @fileOverview The "filebrowser" plugin that adds support for file uploads and
+ *               browsing.
+ *
+ * When a file is uploaded or selected inside the file browser, its URL is
+ * inserted automatically into a field defined in the <code>filebrowser</code>
+ * attribute. In order to specify a field that should be updated, pass the tab ID and
+ * the element ID, separated with a colon.<br /><br />
+ *
+ * <strong>Example 1: (Browse)</strong>
+ *
+ * <pre>
+ * {
+ *      type : 'button',
+ *      id : 'browse',
+ *      filebrowser : 'tabId:elementId',
+ *      label : editor.lang.common.browseServer
+ * }
+ * </pre>
+ *
+ * If you set the <code>filebrowser</code> attribute for an element other than
+ * the <code>fileButton</code>, the <code>Browse</code> action will be triggered.<br /><br />
+ *
+ * <strong>Example 2: (Quick Upload)</strong>
+ *
+ * <pre>
+ * {
+ *      type : 'fileButton',
+ *      id : 'uploadButton',
+ *      filebrowser : 'tabId:elementId',
+ *      label : editor.lang.common.uploadSubmit,
+ *      'for' : [ 'upload', 'upload' ]
+ * }
+ * </pre>
+ *
+ * If you set the <code>filebrowser</code> attribute for a <code>fileButton</code>
+ * element, the <code>QuickUpload</code> action will be executed.<br /><br />
+ *
+ * The filebrowser plugin also supports more advanced configuration performed through
+ * a JavaScript object.
+ *
+ * The following settings are supported:
+ *
+ * <ul>
+ * <li><code>action</code> &ndash; <code>Browse</code> or <code>QuickUpload</code>.</li>
+ * <li><code>target</code> &ndash; the field to update in the <code><em>tabId:elementId</em></code> format.</li>
+ * <li><code>params</code> &ndash; additional arguments to be passed to the server connector (optional).</li>
+ * <li><code>onSelect</code> &ndash; a function to execute when the file is selected/uploaded (optional).</li>
+ * <li><code>url</code> &ndash; the URL to be called (optional).</li>
+ * </ul>
+ *
+ * <strong>Example 3: (Quick Upload)</strong>
+ *
+ * <pre>
+ * {
+ *      type : 'fileButton',
+ *      label : editor.lang.common.uploadSubmit,
+ *      id : 'buttonId',
+ *      filebrowser :
+ *      {
+ *              action : 'QuickUpload', // required
+ *              target : 'tab1:elementId', // required
+ *              params : // optional
+ *              {
+ *                      type : 'Files',
+ *                      currentFolder : '/folder/'
+ *              },
+ *              onSelect : function( fileUrl, errorMessage ) // optional
+ *              {
+ *                      // Do not call the built-in selectFuntion.
+ *                      // return false;
+ *              }
+ *      },
+ *      'for' : [ 'tab1', 'myFile' ]
+ * }
+ * </pre>
+ *
+ * Suppose you have a file element with an ID of <code>myFile</code>, a text
+ * field with an ID of <code>elementId</code> and a <code>fileButton</code>.
+ * If the <code>filebowser.url</code> attribute is not specified explicitly,
+ * the form action will be set to <code>filebrowser[<em>DialogWindowName</em>]UploadUrl</code>
+ * or, if not specified, to <code>filebrowserUploadUrl</code>. Additional parameters
+ * from the <code>params</code> object will be added to the query string. It is
+ * possible to create your own <code>uploadHandler</code> and cancel the built-in
+ * <code>updateTargetElement</code> command.<br /><br />
+ *
+ * <strong>Example 4: (Browse)</strong>
+ *
+ * <pre>
+ * {
+ *      type : 'button',
+ *      id : 'buttonId',
+ *      label : editor.lang.common.browseServer,
+ *      filebrowser :
+ *      {
+ *              action : 'Browse',
+ *              url : '/ckfinder/ckfinder.html&amp;type=Images',
+ *              target : 'tab1:elementId'
+ *      }
+ * }
+ * </pre>
+ *
+ * In this example, when the button is pressed, the file browser will be opened in a
+ * popup window. If you do not specify the <code>filebrowser.url</code> attribute,
+ * <code>filebrowser[<em>DialogName</em>]BrowseUrl</code> or
+ * <code>filebrowserBrowseUrl</code> will be used. After selecting a file in the file
+ * browser, an element with an ID of <code>elementId</code> will be updated. Just
+ * like in the third example, a custom <code>onSelect</code> function may be defined.
+ */
+( function() {
+        // Default input element name for CSRF protection token.
+        var TOKEN_INPUT_NAME = 'ckCsrfToken';
+        // Adds (additional) arguments to given url.
+        //
+        // @param {String}
+        //            url The url.
+        // @param {Object}
+        //            params Additional parameters.
+        function addQueryString( url, params ) {
+                var queryString = [];
+                if ( !params )
+                        return url;
+                else {
+                        for ( var i in params )
+                                queryString.push( i + '=' + encodeURIComponent( params[ i ] ) );
+                }
+                return url + ( ( url.indexOf( '?' ) != -1 ) ? '&' : '?' ) + queryString.join( '&' );
+        }
+        // Make a string's first character uppercase.
+        //
+        // @param {String}
+        //            str String.
+        function ucFirst( str ) {
+                str += '';
+                var f = str.charAt( 0 ).toUpperCase();
+                return f + str.substr( 1 );
+        }
+        // The onlick function assigned to the 'Browse Server' button. Opens the
+        // file browser and updates target field when file is selected.
+        //
+        // @param {CKEDITOR.event}
+        //            evt The event object.
+        function browseServer() {
+                var dialog = this.getDialog();
+                var editor = dialog.getParentEditor();
+                editor._.filebrowserSe = this;
+                var width = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowWidth' ] || editor.config.filebrowserWindowWidth || '80%';
+                var height = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowHeight' ] || editor.config.filebrowserWindowHeight || '70%';
+                var params = this.filebrowser.params || {};
+                params.CKEditor = editor.name;
+                params.CKEditorFuncNum = editor._.filebrowserFn;
+                if ( !params.langCode )
+                        params.langCode = editor.langCode;
+                var url = addQueryString( this.filebrowser.url, params );
+                // TODO: V4: Remove backward compatibility (#8163).
+                editor.popup( url, width, height, editor.config.filebrowserWindowFeatures || editor.config.fileBrowserWindowFeatures );
+        }
+        // Appends token preventing CSRF attacks to the form of provided file input.
+        //
+        // @since 4.5.6
+        // @param {CKEDITOR.dom.element} fileInput
+        function appendToken( fileInput ) {
+                var tokenElement;
+                var form = new CKEDITOR.dom.element( fileInput.$.form );
+                if ( form ) {
+                        // Check if token input element already exists.
+                        tokenElement = form.$.elements[ TOKEN_INPUT_NAME ];
+                        // Create new if needed.
+                        if ( !tokenElement ) {
+                                tokenElement = new CKEDITOR.dom.element( 'input' );
+                                tokenElement.setAttributes( {
+                                        name: TOKEN_INPUT_NAME,
+                                        type: 'hidden'
+                                } );
+                                form.append( tokenElement );
+                        } else {
+                                tokenElement = new CKEDITOR.dom.element( tokenElement );
+                        }
+                        tokenElement.setAttribute( 'value', CKEDITOR.tools.getCsrfToken() );
+                }
+        }
+        // The onlick function assigned to the 'Upload' button. Makes the final
+        // decision whether form is really submitted and updates target field when
+        // file is uploaded.
+        //
+        // @param {CKEDITOR.event}
+        //            evt The event object.
+        function uploadFile() {
+                var dialog = this.getDialog();
+                var editor = dialog.getParentEditor();
+                editor._.filebrowserSe = this;
+                // If user didn't select the file, stop the upload.
+                if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement().$.value )
+                        return false;
+                if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getAction() )
+                        return false;
+                return true;
+        }
+        // Setups the file element.
+        //
+        // @param {CKEDITOR.ui.dialog.file}
+        //            fileInput The file element used during file upload.
+        // @param {Object}
+        //            filebrowser Object containing filebrowser settings assigned to
+        //            the fileButton associated with this file element.
+        function setupFileElement( editor, fileInput, filebrowser ) {
+                var params = filebrowser.params || {};
+                params.CKEditor = editor.name;
+                params.CKEditorFuncNum = editor._.filebrowserFn;
+                if ( !params.langCode )
+                        params.langCode = editor.langCode;
+                fileInput.action = addQueryString( filebrowser.url, params );
+                fileInput.filebrowser = filebrowser;
+        }
+        // Traverse through the content definition and attach filebrowser to
+        // elements with 'filebrowser' attribute.
+        //
+        // @param String
+        //            dialogName Dialog name.
+        // @param {CKEDITOR.dialog.definitionObject}
+        //            definition Dialog definition.
+        // @param {Array}
+        //            elements Array of {@link CKEDITOR.dialog.definition.content}
+        //            objects.
+        function attachFileBrowser( editor, dialogName, definition, elements ) {
+                if ( !elements || !elements.length )
+                        return;
+                var element;
+                for ( var i = elements.length; i--; ) {
+                        element = elements[ i ];
+                        if ( element.type == 'hbox' || element.type == 'vbox' || element.type == 'fieldset' )
+                                attachFileBrowser( editor, dialogName, definition, element.children );
+                        if ( !element.filebrowser )
+                                continue;
+                        if ( typeof element.filebrowser == 'string' ) {
+                                var fb = {
+                                        action: ( element.type == 'fileButton' ) ? 'QuickUpload' : 'Browse',
+                                        target: element.filebrowser
+                                };
+                                element.filebrowser = fb;
+                        }
+                        if ( element.filebrowser.action == 'Browse' ) {
+                                var url = element.filebrowser.url;
+                                if ( url === undefined ) {
+                                        url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];
+                                        if ( url === undefined )
+                                                url = editor.config.filebrowserBrowseUrl;
+                                }
+                                if ( url ) {
+                                        element.onClick = browseServer;
+                                        element.filebrowser.url = url;
+                                        element.hidden = false;
+                                }
+                        } else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] ) {
+                                url = element.filebrowser.url;
+                                if ( url === undefined ) {
+                                        url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];
+                                        if ( url === undefined )
+                                                url = editor.config.filebrowserUploadUrl;
+                                }
+                                if ( url ) {
+                                        var onClick = element.onClick;
+                                        element.onClick = function( evt ) {
+                                                // "element" here means the definition object, so we need to find the correct
+                                                // button to scope the event call
+                                                var sender = evt.sender;
+                                                if ( onClick && onClick.call( sender, evt ) === false )
+                                                        return false;
+                                                if ( uploadFile.call( sender, evt ) ) {
+                                                        var fileInput = sender.getDialog().getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement();
+                                                        // Append token preventing CSRF attacks.
+                                                        appendToken( fileInput );
+                                                        return true;
+                                                }
+                                                return false;
+                                        };
+                                        element.filebrowser.url = url;
+                                        element.hidden = false;
+                                        setupFileElement( editor, definition.getContents( element[ 'for' ][ 0 ] ).get( element[ 'for' ][ 1 ] ), element.filebrowser );
+                                }
+                        }
+                }
+        }
+        // Updates the target element with the url of uploaded/selected file.
+        //
+        // @param {String}
+        //            url The url of a file.
+        function updateTargetElement( url, sourceElement ) {
+                var dialog = sourceElement.getDialog();
+                var targetElement = sourceElement.filebrowser.target || null;
+                // If there is a reference to targetElement, update it.
+                if ( targetElement ) {
+                        var target = targetElement.split( ':' );
+                        var element = dialog.getContentElement( target[ 0 ], target[ 1 ] );
+                        if ( element ) {
+                                element.setValue( url );
+                                dialog.selectPage( target[ 0 ] );
+                        }
+                }
+        }
+        // Returns true if filebrowser is configured in one of the elements.
+        //
+        // @param {CKEDITOR.dialog.definitionObject}
+        //            definition Dialog definition.
+        // @param String
+        //            tabId The tab id where element(s) can be found.
+        // @param String
+        //            elementId The element id (or ids, separated with a semicolon) to check.
+        function isConfigured( definition, tabId, elementId ) {
+                if ( elementId.indexOf( ';' ) !== -1 ) {
+                        var ids = elementId.split( ';' );
+                        for ( var i = 0; i < ids.length; i++ ) {
+                                if ( isConfigured( definition, tabId, ids[ i ] ) )
+                                        return true;
+                        }
+                        return false;
+                }
+                var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;
+                return ( elementFileBrowser && elementFileBrowser.url );
+        }
+        function setUrl( fileUrl, data ) {
+                var dialog = this._.filebrowserSe.getDialog(),
+                        targetInput = this._.filebrowserSe[ 'for' ],
+                        onSelect = this._.filebrowserSe.filebrowser.onSelect;
+                if ( targetInput )
+                        dialog.getContentElement( targetInput[ 0 ], targetInput[ 1 ] ).reset();
+                if ( typeof data == 'function' && data.call( this._.filebrowserSe ) === false )
+                        return;
+                if ( onSelect && onSelect.call( this._.filebrowserSe, fileUrl, data ) === false )
+                        return;
+                // The "data" argument may be used to pass the error message to the editor.
+                if ( typeof data == 'string' && data )
+                        alert( data ); // jshint ignore:line
+                if ( fileUrl )
+                        updateTargetElement( fileUrl, this._.filebrowserSe );
+        }
+        CKEDITOR.plugins.add( 'filebrowser', {
+                requires: 'popup',
+                init: function( editor ) {
+                        editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );
+                        editor.on( 'destroy', function() {
+                                CKEDITOR.tools.removeFunction( this._.filebrowserFn );
+                        } );
+                }
+        } );
+        CKEDITOR.on( 'dialogDefinition', function( evt ) {
+                // We require filebrowser plugin to be loaded.
+                if ( !evt.editor.plugins.filebrowser )
+                        return;
+                var definition = evt.data.definition,
+                        element;
+                // Associate filebrowser to elements with 'filebrowser' attribute.
+                for ( var i = 0; i < definition.contents.length; ++i ) {
+                        if ( ( element = definition.contents[ i ] ) ) {
+                                attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );
+                                if ( element.hidden && element.filebrowser )
+                                        element.hidden = !isConfigured( definition, element.id, element.filebrowser );
+                        }
+                }
+        } );
+} )();
+/**
+ * The location of an external file manager that should be launched when the **Browse Server**
+ * button is pressed. If configured, the **Browse Server** button will appear in the
+ * **Link**, **Image**, and **Flash** dialog windows.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_browse_upload)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserBrowseUrl = '/browser/browse.php';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of the script that handles file uploads.
+ * If set, the **Upload** tab will appear in the **Link**, **Image**,
+ * and **Flash** dialog windows.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_browse_upload)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserUploadUrl = '/uploader/upload.php';
+ *
+ * **Note:** This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).
+ * To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}
+ * configuration option.
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of an external file manager that should be launched when the **Browse Server**
+ * button is pressed in the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserImageBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of an external file browser that should be launched when the **Browse Server**
+ * button is pressed in the **Flash** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserFlashBrowseUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of the script that handles file uploads in the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';
+ *
+ * **Note:** This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).
+ * To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}
+ * or {@link CKEDITOR.config#imageUploadUrl} configuration option.
+ *
+ * @since 3.0
+ * @cfg {String} [filebrowserImageUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of the script that handles file uploads in the **Flash** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';
+ *
+ * @since 3.0
+ * @cfg {String} filebrowserFlashUploadUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The location of an external file manager that should be launched when the **Browse Server**
+ * button is pressed in the **Link** tab of the **Image** dialog window.
+ *
+ * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';
+ *
+ * @since 3.2
+ * @cfg {String} [filebrowserImageBrowseLinkUrl='' (empty string = disabled)]
+ * @member CKEDITOR.config
+ */
+/**
+ * The features to use in the file manager popup window.
+ *
+ *              config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';
+ *
+ * @since 3.4.1
+ * @cfg {String} [filebrowserWindowFeatures='location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes']
+ * @member CKEDITOR.config
+ */
+/**
+ * The width of the file manager popup window. It can be a number denoting a value in
+ * pixels or a percent string.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserWindowWidth = 750;
+ *
+ *              config.filebrowserWindowWidth = '50%';
+ *
+ * @cfg {Number/String} [filebrowserWindowWidth='80%']
+ * @member CKEDITOR.config
+ */
+/**
+ * The height of the file manager popup window. It can be a number denoting a value in
+ * pixels or a percent string.
+ *
+ * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)
+ * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
+ *
+ *              config.filebrowserWindowHeight = 580;
+ *
+ *              config.filebrowserWindowHeight = '50%';
+ *
+ * @cfg {Number/String} [filebrowserWindowHeight='70%']
+ * @member CKEDITOR.config
+ */
author	Ismaël Bouya <ismael.bouya@normalesup.org>	2016-01-25 17:45:33 +0100
committer	Ismaël Bouya <ismael.bouya@normalesup.org>	2016-01-25 18:00:33 +0100
commit	7adcb81e4f83f98c468889aaa5a85558ba88c770 (patch)
tree	0d6ede733777b29060b48df4afaa2c64bfbae276 /sources/plugins/filebrowser
download	connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.tar.gz connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.tar.zst connexionswing-ckeditor-component-7adcb81e4f83f98c468889aaa5a85558ba88c770.zip

diff --git a/sources/plugins/filebrowser/plugin.js b/sources/plugins/filebrowser/plugin.js new file mode 100644 index 00000000..1fd9f22e --- /dev/null +++ b/sources/plugins/filebrowser/plugin.js
@@ -0,0 +1,573 @@
	1	/**
	2	* @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
	3	* For licensing, see LICENSE.md or http://ckeditor.com/license
	4	*/
	5
	6	/**
	7	* @fileOverview The "filebrowser" plugin that adds support for file uploads and
	8	* browsing.
	9	*
	10	* When a file is uploaded or selected inside the file browser, its URL is
	11	* inserted automatically into a field defined in the <code>filebrowser</code>
	12	* attribute. In order to specify a field that should be updated, pass the tab ID and
	13	* the element ID, separated with a colon.<br /><br />
	14	*
	15	* <strong>Example 1: (Browse)</strong>
	16	*
	17	* <pre>
	18	* {
	19	* type : 'button',
	20	* id : 'browse',
	21	* filebrowser : 'tabId:elementId',
	22	* label : editor.lang.common.browseServer
	23	* }
	24	* </pre>
	25	*
	26	* If you set the <code>filebrowser</code> attribute for an element other than
	27	* the <code>fileButton</code>, the <code>Browse</code> action will be triggered.<br /><br />
	28	*
	29	* <strong>Example 2: (Quick Upload)</strong>
	30	*
	31	* <pre>
	32	* {
	33	* type : 'fileButton',
	34	* id : 'uploadButton',
	35	* filebrowser : 'tabId:elementId',
	36	* label : editor.lang.common.uploadSubmit,
	37	* 'for' : [ 'upload', 'upload' ]
	38	* }
	39	* </pre>
	40	*
	41	* If you set the <code>filebrowser</code> attribute for a <code>fileButton</code>
	42	* element, the <code>QuickUpload</code> action will be executed.<br /><br />
	43	*
	44	* The filebrowser plugin also supports more advanced configuration performed through
	45	* a JavaScript object.
	46	*
	47	* The following settings are supported:
	48	*
	49	* <ul>
	50	* <li><code>action</code> – <code>Browse</code> or <code>QuickUpload</code>.</li>
	51	* <li><code>target</code> – the field to update in the <code><em>tabId:elementId</em></code> format.</li>
	52	* <li><code>params</code> – additional arguments to be passed to the server connector (optional).</li>
	53	* <li><code>onSelect</code> – a function to execute when the file is selected/uploaded (optional).</li>
	54	* <li><code>url</code> – the URL to be called (optional).</li>
	55	* </ul>
	56	*
	57	* <strong>Example 3: (Quick Upload)</strong>
	58	*
	59	* <pre>
	60	* {
	61	* type : 'fileButton',
	62	* label : editor.lang.common.uploadSubmit,
	63	* id : 'buttonId',
	64	* filebrowser :
	65	* {
	66	* action : 'QuickUpload', // required
	67	* target : 'tab1:elementId', // required
	68	* params : // optional
	69	* {
	70	* type : 'Files',
	71	* currentFolder : '/folder/'
	72	* },
	73	* onSelect : function( fileUrl, errorMessage ) // optional
	74	* {
	75	* // Do not call the built-in selectFuntion.
	76	* // return false;
	77	* }
	78	* },
	79	* 'for' : [ 'tab1', 'myFile' ]
	80	* }
	81	* </pre>
	82	*
	83	* Suppose you have a file element with an ID of <code>myFile</code>, a text
	84	* field with an ID of <code>elementId</code> and a <code>fileButton</code>.
	85	* If the <code>filebowser.url</code> attribute is not specified explicitly,
	86	* the form action will be set to <code>filebrowser[<em>DialogWindowName</em>]UploadUrl</code>
	87	* or, if not specified, to <code>filebrowserUploadUrl</code>. Additional parameters
	88	* from the <code>params</code> object will be added to the query string. It is
	89	* possible to create your own <code>uploadHandler</code> and cancel the built-in
	90	* <code>updateTargetElement</code> command.<br /><br />
	91	*
	92	* <strong>Example 4: (Browse)</strong>
	93	*
	94	* <pre>
	95	* {
	96	* type : 'button',
	97	* id : 'buttonId',
	98	* label : editor.lang.common.browseServer,
	99	* filebrowser :
	100	* {
	101	* action : 'Browse',
	102	* url : '/ckfinder/ckfinder.html&type=Images',
	103	* target : 'tab1:elementId'
	104	* }
	105	* }
	106	* </pre>
	107	*
	108	* In this example, when the button is pressed, the file browser will be opened in a
	109	* popup window. If you do not specify the <code>filebrowser.url</code> attribute,
	110	* <code>filebrowser[<em>DialogName</em>]BrowseUrl</code> or
	111	* <code>filebrowserBrowseUrl</code> will be used. After selecting a file in the file
	112	* browser, an element with an ID of <code>elementId</code> will be updated. Just
	113	* like in the third example, a custom <code>onSelect</code> function may be defined.
	114	*/
	115
	116	( function() {
	117	// Default input element name for CSRF protection token.
	118	var TOKEN_INPUT_NAME = 'ckCsrfToken';
	119
	120	// Adds (additional) arguments to given url.
	121	//
	122	// @param {String}
	123	// url The url.
	124	// @param {Object}
	125	// params Additional parameters.
	126	function addQueryString( url, params ) {
	127	var queryString = [];
	128
	129	if ( !params )
	130	return url;
	131	else {
	132	for ( var i in params )
	133	queryString.push( i + '=' + encodeURIComponent( params[ i ] ) );
	134	}
	135
	136	return url + ( ( url.indexOf( '?' ) != -1 ) ? '&' : '?' ) + queryString.join( '&' );
	137	}
	138
	139	// Make a string's first character uppercase.
	140	//
	141	// @param {String}
	142	// str String.
	143	function ucFirst( str ) {
	144	str += '';
	145	var f = str.charAt( 0 ).toUpperCase();
	146	return f + str.substr( 1 );
	147	}
	148
	149	// The onlick function assigned to the 'Browse Server' button. Opens the
	150	// file browser and updates target field when file is selected.
	151	//
	152	// @param {CKEDITOR.event}
	153	// evt The event object.
	154	function browseServer() {
	155	var dialog = this.getDialog();
	156	var editor = dialog.getParentEditor();
	157
	158	editor._.filebrowserSe = this;
	159
	160	var width = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowWidth' ] \|\| editor.config.filebrowserWindowWidth \|\| '80%';
	161	var height = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowHeight' ] \|\| editor.config.filebrowserWindowHeight \|\| '70%';
	162
	163	var params = this.filebrowser.params \|\| {};
	164	params.CKEditor = editor.name;
	165	params.CKEditorFuncNum = editor._.filebrowserFn;
	166	if ( !params.langCode )
	167	params.langCode = editor.langCode;
	168
	169	var url = addQueryString( this.filebrowser.url, params );
	170	// TODO: V4: Remove backward compatibility (#8163).
	171	editor.popup( url, width, height, editor.config.filebrowserWindowFeatures \|\| editor.config.fileBrowserWindowFeatures );
	172	}
	173
	174	// Appends token preventing CSRF attacks to the form of provided file input.
	175	//
	176	// @since 4.5.6
	177	// @param {CKEDITOR.dom.element} fileInput
	178	function appendToken( fileInput ) {
	179	var tokenElement;
	180	var form = new CKEDITOR.dom.element( fileInput.$.form );
	181
	182	if ( form ) {
	183	// Check if token input element already exists.
	184	tokenElement = form.$.elements[ TOKEN_INPUT_NAME ];
	185
	186	// Create new if needed.
	187	if ( !tokenElement ) {
	188	tokenElement = new CKEDITOR.dom.element( 'input' );
	189	tokenElement.setAttributes( {
	190	name: TOKEN_INPUT_NAME,
	191	type: 'hidden'
	192	} );
	193
	194	form.append( tokenElement );
	195	} else {
	196	tokenElement = new CKEDITOR.dom.element( tokenElement );
	197	}
	198
	199	tokenElement.setAttribute( 'value', CKEDITOR.tools.getCsrfToken() );
	200	}
	201	}
	202
	203	// The onlick function assigned to the 'Upload' button. Makes the final
	204	// decision whether form is really submitted and updates target field when
	205	// file is uploaded.
	206	//
	207	// @param {CKEDITOR.event}
	208	// evt The event object.
	209	function uploadFile() {
	210	var dialog = this.getDialog();
	211	var editor = dialog.getParentEditor();
	212
	213	editor._.filebrowserSe = this;
	214
	215	// If user didn't select the file, stop the upload.
	216	if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement().$.value )
	217	return false;
	218
	219	if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getAction() )
	220	return false;
	221
	222	return true;
	223	}
	224
	225	// Setups the file element.
	226	//
	227	// @param {CKEDITOR.ui.dialog.file}
	228	// fileInput The file element used during file upload.
	229	// @param {Object}
	230	// filebrowser Object containing filebrowser settings assigned to
	231	// the fileButton associated with this file element.
	232	function setupFileElement( editor, fileInput, filebrowser ) {
	233	var params = filebrowser.params \|\| {};
	234	params.CKEditor = editor.name;
	235	params.CKEditorFuncNum = editor._.filebrowserFn;
	236	if ( !params.langCode )
	237	params.langCode = editor.langCode;
	238
	239	fileInput.action = addQueryString( filebrowser.url, params );
	240	fileInput.filebrowser = filebrowser;
	241	}
	242
	243	// Traverse through the content definition and attach filebrowser to
	244	// elements with 'filebrowser' attribute.
	245	//
	246	// @param String
	247	// dialogName Dialog name.
	248	// @param {CKEDITOR.dialog.definitionObject}
	249	// definition Dialog definition.
	250	// @param {Array}
	251	// elements Array of {@link CKEDITOR.dialog.definition.content}
	252	// objects.
	253	function attachFileBrowser( editor, dialogName, definition, elements ) {
	254	if ( !elements \|\| !elements.length )
	255	return;
	256
	257	var element;
	258
	259	for ( var i = elements.length; i--; ) {
	260	element = elements[ i ];
	261
	262	if ( element.type == 'hbox' \|\| element.type == 'vbox' \|\| element.type == 'fieldset' )
	263	attachFileBrowser( editor, dialogName, definition, element.children );
	264
	265	if ( !element.filebrowser )
	266	continue;
	267
	268	if ( typeof element.filebrowser == 'string' ) {
	269	var fb = {
	270	action: ( element.type == 'fileButton' ) ? 'QuickUpload' : 'Browse',
	271	target: element.filebrowser
	272	};
	273	element.filebrowser = fb;
	274	}
	275
	276	if ( element.filebrowser.action == 'Browse' ) {
	277	var url = element.filebrowser.url;
	278	if ( url === undefined ) {
	279	url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];
	280	if ( url === undefined )
	281	url = editor.config.filebrowserBrowseUrl;
	282	}
	283
	284	if ( url ) {
	285	element.onClick = browseServer;
	286	element.filebrowser.url = url;
	287	element.hidden = false;
	288	}
	289	} else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] ) {
	290	url = element.filebrowser.url;
	291	if ( url === undefined ) {
	292	url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];
	293	if ( url === undefined )
	294	url = editor.config.filebrowserUploadUrl;
	295	}
	296
	297	if ( url ) {
	298	var onClick = element.onClick;
	299	element.onClick = function( evt ) {
	300	// "element" here means the definition object, so we need to find the correct
	301	// button to scope the event call
	302	var sender = evt.sender;
	303	if ( onClick && onClick.call( sender, evt ) === false )
	304	return false;
	305
	306	if ( uploadFile.call( sender, evt ) ) {
	307	var fileInput = sender.getDialog().getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement();
	308
	309	// Append token preventing CSRF attacks.
	310	appendToken( fileInput );
	311	return true;
	312	}
	313
	314
	315	return false;
	316	};
	317
	318	element.filebrowser.url = url;
	319	element.hidden = false;
	320	setupFileElement( editor, definition.getContents( element[ 'for' ][ 0 ] ).get( element[ 'for' ][ 1 ] ), element.filebrowser );
	321	}
	322	}
	323	}
	324	}
	325
	326	// Updates the target element with the url of uploaded/selected file.
	327	//
	328	// @param {String}
	329	// url The url of a file.
	330	function updateTargetElement( url, sourceElement ) {
	331	var dialog = sourceElement.getDialog();
	332	var targetElement = sourceElement.filebrowser.target \|\| null;
	333
	334	// If there is a reference to targetElement, update it.
	335	if ( targetElement ) {
	336	var target = targetElement.split( ':' );
	337	var element = dialog.getContentElement( target[ 0 ], target[ 1 ] );
	338	if ( element ) {
	339	element.setValue( url );
	340	dialog.selectPage( target[ 0 ] );
	341	}
	342	}
	343	}
	344
	345	// Returns true if filebrowser is configured in one of the elements.
	346	//
	347	// @param {CKEDITOR.dialog.definitionObject}
	348	// definition Dialog definition.
	349	// @param String
	350	// tabId The tab id where element(s) can be found.
	351	// @param String
	352	// elementId The element id (or ids, separated with a semicolon) to check.
	353	function isConfigured( definition, tabId, elementId ) {
	354	if ( elementId.indexOf( ';' ) !== -1 ) {
	355	var ids = elementId.split( ';' );
	356	for ( var i = 0; i < ids.length; i++ ) {
	357	if ( isConfigured( definition, tabId, ids[ i ] ) )
	358	return true;
	359	}
	360	return false;
	361	}
	362
	363	var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;
	364	return ( elementFileBrowser && elementFileBrowser.url );
	365	}
	366
	367	function setUrl( fileUrl, data ) {
	368	var dialog = this._.filebrowserSe.getDialog(),
	369	targetInput = this._.filebrowserSe[ 'for' ],
	370	onSelect = this._.filebrowserSe.filebrowser.onSelect;
	371
	372	if ( targetInput )
	373	dialog.getContentElement( targetInput[ 0 ], targetInput[ 1 ] ).reset();
	374
	375	if ( typeof data == 'function' && data.call( this._.filebrowserSe ) === false )
	376	return;
	377
	378	if ( onSelect && onSelect.call( this._.filebrowserSe, fileUrl, data ) === false )
	379	return;
	380
	381	// The "data" argument may be used to pass the error message to the editor.
	382	if ( typeof data == 'string' && data )
	383	alert( data ); // jshint ignore:line
	384
	385	if ( fileUrl )
	386	updateTargetElement( fileUrl, this._.filebrowserSe );
	387	}
	388
	389	CKEDITOR.plugins.add( 'filebrowser', {
	390	requires: 'popup',
	391	init: function( editor ) {
	392	editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );
	393	editor.on( 'destroy', function() {
	394	CKEDITOR.tools.removeFunction( this._.filebrowserFn );
	395	} );
	396	}
	397	} );
	398
	399	CKEDITOR.on( 'dialogDefinition', function( evt ) {
	400	// We require filebrowser plugin to be loaded.
	401	if ( !evt.editor.plugins.filebrowser )
	402	return;
	403
	404	var definition = evt.data.definition,
	405	element;
	406	// Associate filebrowser to elements with 'filebrowser' attribute.
	407	for ( var i = 0; i < definition.contents.length; ++i ) {
	408	if ( ( element = definition.contents[ i ] ) ) {
	409	attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );
	410	if ( element.hidden && element.filebrowser )
	411	element.hidden = !isConfigured( definition, element.id, element.filebrowser );
	412
	413	}
	414	}
	415	} );
	416
	417	} )();
	418
	419	/**
	420	* The location of an external file manager that should be launched when the Browse Server
	421	* button is pressed. If configured, the Browse Server button will appear in the
	422	* Link, Image, and Flash dialog windows.
	423	*
	424	* Read more in the [documentation](#!/guide/dev_file_browse_upload)
	425	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	426	*
	427	* config.filebrowserBrowseUrl = '/browser/browse.php';
	428	*
	429	* @since 3.0
	430	* @cfg {String} [filebrowserBrowseUrl='' (empty string = disabled)]
	431	* @member CKEDITOR.config
	432	*/
	433
	434	/**
	435	* The location of the script that handles file uploads.
	436	* If set, the Upload tab will appear in the Link, Image,
	437	* and Flash dialog windows.
	438	*
	439	* Read more in the [documentation](#!/guide/dev_file_browse_upload)
	440	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	441	*
	442	* config.filebrowserUploadUrl = '/uploader/upload.php';
	443	*
	444	* Note: This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).
	445	* To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}
	446	* configuration option.
	447	*
	448	* @since 3.0
	449	* @cfg {String} [filebrowserUploadUrl='' (empty string = disabled)]
	450	* @member CKEDITOR.config
	451	*/
	452
	453	/**
	454	* The location of an external file manager that should be launched when the Browse Server
	455	* button is pressed in the Image dialog window.
	456	*
	457	* If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
	458	*
	459	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
	460	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	461	*
	462	* config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
	463	*
	464	* @since 3.0
	465	* @cfg {String} [filebrowserImageBrowseUrl='' (empty string = disabled)]
	466	* @member CKEDITOR.config
	467	*/
	468
	469	/**
	470	* The location of an external file browser that should be launched when the Browse Server
	471	* button is pressed in the Flash dialog window.
	472	*
	473	* If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
	474	*
	475	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
	476	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	477	*
	478	* config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';
	479	*
	480	* @since 3.0
	481	* @cfg {String} [filebrowserFlashBrowseUrl='' (empty string = disabled)]
	482	* @member CKEDITOR.config
	483	*/
	484
	485	/**
	486	* The location of the script that handles file uploads in the Image dialog window.
	487	*
	488	* If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
	489	*
	490	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
	491	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	492	*
	493	* config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';
	494	*
	495	* Note: This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).
	496	* To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}
	497	* or {@link CKEDITOR.config#imageUploadUrl} configuration option.
	498	*
	499	* @since 3.0
	500	* @cfg {String} [filebrowserImageUploadUrl='' (empty string = disabled)]
	501	* @member CKEDITOR.config
	502	*/
	503
	504	/**
	505	* The location of the script that handles file uploads in the Flash dialog window.
	506	*
	507	* If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.
	508	*
	509	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
	510	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	511	*
	512	* config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';
	513	*
	514	* @since 3.0
	515	* @cfg {String} filebrowserFlashUploadUrl='' (empty string = disabled)]
	516	* @member CKEDITOR.config
	517	*/
	518
	519	/**
	520	* The location of an external file manager that should be launched when the Browse Server
	521	* button is pressed in the Link tab of the Image dialog window.
	522	*
	523	* If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.
	524	*
	525	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)
	526	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	527	*
	528	* config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';
	529	*
	530	* @since 3.2
	531	* @cfg {String} [filebrowserImageBrowseLinkUrl='' (empty string = disabled)]
	532	* @member CKEDITOR.config
	533	*/
	534
	535	/**
	536	* The features to use in the file manager popup window.
	537	*
	538	* config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';
	539	*
	540	* @since 3.4.1
	541	* @cfg {String} [filebrowserWindowFeatures='location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes']
	542	* @member CKEDITOR.config
	543	*/
	544
	545	/**
	546	* The width of the file manager popup window. It can be a number denoting a value in
	547	* pixels or a percent string.
	548	*
	549	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)
	550	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	551	*
	552	* config.filebrowserWindowWidth = 750;
	553	*
	554	* config.filebrowserWindowWidth = '50%';
	555	*
	556	* @cfg {Number/String} [filebrowserWindowWidth='80%']
	557	* @member CKEDITOR.config
	558	*/
	559
	560	/**
	561	* The height of the file manager popup window. It can be a number denoting a value in
	562	* pixels or a percent string.
	563	*
	564	* Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)
	565	* and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).
	566	*
	567	* config.filebrowserWindowHeight = 580;
	568	*
	569	* config.filebrowserWindowHeight = '50%';
	570	*
	571	* @cfg {Number/String} [filebrowserWindowHeight='70%']
	572	* @member CKEDITOR.config
	573	*/